/*test组件:MagicalCoder参考lib\mc\magicalcoder.js 闭包的写法有利于内部变量不随意暴漏出去*/
(function(){
  var KCVUtil = {
    getParams:function(focusNode,suffix) {
        suffix = suffix ||'';
        var MCK = 'mck'+suffix;
        var MCC = 'mcc'+suffix;
        var MCV = 'mcv'+suffix;
        var attributes = focusNode.attributes;
        var params = [];
        var reg = new RegExp("^"+MCK+"(\\d+)$");
        for(var key in attributes){
          var exec = reg.exec(key);
          if( exec===null || exec.length<=1){
            continue;
          }
          var idx = Number(exec[1]);//索引
          var mck = attributes[key];
          var mcc = attributes[MCC+idx];
          var mcv = attributes[':'+MCV+idx];
          params.push({name:mck,compare:mcc,value:mcv});
        }
        return params;
    },
    toParams:function (focusNode,params,suffix){
      suffix = suffix ||'';
      var MCK = 'mck'+suffix;
      var MCC = 'mcc'+suffix;
      var MCV = 'mcv'+suffix;
      //先清空所有属性配置
      var attributes = focusNode.attributes;
      var reg = new RegExp("^("+MCK+"|"+MCC+"|"+MCV+")\d$")
      for(var key in attributes){
        if(reg.test(key)){
          delete attributes[key];
        }
      }
      //开始重新赋值
      for(var i=0;i<params.length;i++){
        var param = params[i];
        var idx = i+1;
        if(param.name){
          attributes[MCK+idx] = param.name;
          attributes[MCC+idx] = param.compare||"=";
          attributes[':'+MCV+idx] = param.value;
        }
      }
      //清空下之前的配置
      params.length=0;
    }
  }
  var TABLE_HTML = '<mc-new-vxe-table :mc-page-size="10"><template v-slot:query="scope"></template><vxe-table-column  field="id" title="ID"></vxe-table-column><template v-slot:form="scope"></template><template v-slot:parent="scope"></template></mc-new-vxe-table>';
  var projectUuid = MagicalCoder.getUrlParameter("projectUuid");
  MagicalCoder.install({
    /*左侧可拖拽的源*/
    dragItems:[
      {
        name:"官方组件",
        icon:"layui-icon layui-icon-face-smile",
        children:[
          {
            name:"热门",
            icon:"layui-icon layui-icon-face-smile",
            children:[
              {
                name:"父子表格",
                icon:"el-icon-s-grid",
                html: TABLE_HTML
              },
              {
                name:"遍历列表",
                icon:"el-icon-notebook-2",
                html: '<mc-el-row><template #row="scope"><mc-el-col class="mc-ui-absolute-pane" mcstyle="ab-unit-top:px" :span="24"></mc-el-col></template></mc-el-row>'
              },
              {
                name:"主键生成器",
                icon:"el-icon-s-flag",
                html: '<mc-pk-creator>生成问卷</mc-pk-creator>'
              },{
                name:"问卷调查",
                icon:"ri-edit-box-line",
                html: '<mc-questionnaire><template #body="scope"><el-col class="mc-ui-absolute-pane" mcstyle="ab-unit-top:px" :span="24"></el-col></template><template #bottom="scope"><el-col :span="24"><el-button type="primary" @click="scope.row.action=1">提交</el-button></el-col></template></mc-questionnaire>'
              },
              {
                name:"打印",
                icon:"el-icon-printer",
                html:"<mc-print canvas='true' print-id='magicalDragScene'>打印</mc-print>"
              },{
                name:"超链接",
                icon:"el-icon-link",
                html:"<mc-a url='http://www.magicalcoder.com'>跳转</mc-a>"
              },
              {
                name:"头像",
                icon:"el-icon-s-custom",
                html:"<mc-avatar></mc-avatar>"
              },{
                name:"图片",
                icon:"el-icon-picture-outline",
                html:"<mc-image src='img.jpg'></mc-image>"
              },
            ]
          },
         /* {
            name:"展示",
            icon:"layui-icon layui-icon-face-smile",
            children:[
              {
                name:"远程标签",
                icon:"ri-star-smile-line",
                html:"<mc-remote-tag>标签</mc-remote-tag>"
              },{
                name:"远程图标",
                icon:"ri-star-smile-line",
                html:"<mc-remote-icon>图文</mc-remote-icon>"
              },
              {
                name:"链接按钮",
                icon:"el-icon-link",
                html:"<mc-redirect-button href='http://www.magicalcoder.com' target='_blank'>跳转</mc-redirect-button>"
              },
            ]
          },*/
          {
            name:"交互",
            icon:"",
            children:[
              {
                name:"页面加载后",
                icon:"el-icon-edit",
                html: "<mc-mounted >页面加载后</mc-mounted>"
              }
            ]
          },
          {
            name:"表单",
            icon:"",
            children:[
              {
                name:"标题",
                icon:"el-icon-edit",
                html: "<label>标题</label>"
              },{
                name:"图片上传",
                icon:"el-icon-upload",
                html: "<mc-image-upload v-model='mcImageUpload' action='magical_lowcode/openapi/upload'></mc-image-upload>"
              },{
                name:"复选框组",
                icon:"ri-edit-box-line",
                html: "<mc-checkbox-group v-model='mcCheckboxGroup'><el-checkbox label='1'>多选项1</el-checkbox></mc-checkbox-group>"
              },{
                name:"评分",
                icon:"el-icon-star-off",
                html:"<mc-rate v-model='mcRate'></mc-rate>"
              },{
                name:"开关",
                icon:"el-icon-open",
                html:"<mc-switch v-model='mcSwitchValue' :mc-default-value='false'></mc-switch>"
              },{
                name:"一级级联下拉框",
                icon:"ri-bank-card-2-fill",
                html:"<mc-remote-select v-model='remoteSelect' @focus='focus'></mc-remote-select>"
              },
              {
                name:"二级级联下拉",
                icon:"el-icon-s-grid",
                html: "<mc-parent-child-select :p-model.sync='parentId' v-model='childId' @focus='focus'></mc-parent-child-select>"
              },              {
                name:"三级级联下拉",
                icon:"el-icon-s-grid",
                html: "<mc-parent-child-grandson-select :p-model.sync='parentId' :c-model.sync='childId'  v-model='grandsonId' @focus='focus'></mc-parent-child-grandson-select>"
              },
              {
                name:"输入框",
                icon:"ri-input-method-line",
                html:"<el-input v-model='input' placeholder='请输入内容'></el-input>",
              },{
                name:"密码框",
                icon:"ri-lock-password-line",
                html:"<el-input v-model='input' placeholder='请输入内容' show-password></el-input>",
              },{
                name:"下拉框",
                icon:"ri-bank-card-2-fill",
                html:"<el-select v-model='select' @focus='focus'><el-option label='选择1' value='1'></el-option></el-select>"
              },
              {
                name:"日期控件",
                icon:"ri-calendar-2-line",
                html:"<mc-date-picker v-model='datePicker' ></mc-date-picker>"
              },              {
                name:"单选框",
                icon:"ri-radio-button-line",
                html:"<el-radio-group v-model='radioGroup'><el-radio label='1'>单选项1</el-radio><el-radio label='2'>单选项2</el-radio></el-radio-group>"
              },
              {
                  name:"富文本",
                  icon:"ri-emphasis",
                  html:'<mc-kindeditor style="height:300px;" mc-db-type="clob" :data.sync="kindeditorValue" file-upload="magical_lowcode/openapi/upload?from=kindeditor"></mc-kindeditor>'
              },{
                  name:"预览富文本",
                  icon:"ri-emphasis",
                  html:'<div class="mc-kindeditor-view" v-html="scope.row.kindeditorValue"></div>'
              }

            ]
          },


        ]
      }
    ],
    /*自定义组件和属性*/
    components:[
        {"identifier":"mc-date-picker","properties":{"name":"日期选择器","treeExtraName":{"attr":["v-model"]},"dragInto":false,"duplicate":true,"assistDuplicate":true,"copy":false,"paste":true,"canDelete":true,"assistDelete":true,"bind":{"v-model":"\"\""}},
            "attributes":[
                {"title":"交互","active":false,"content":[{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"变量名*","attrName":"v-model","extendKey":"variable"},CommonUtil.buildMcCondition()]},
                {"title":"属性","active":true,"content":[{"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"显示类型","attrName":"type","options":[{"year":"年"},{"month":"年月"},{"date":"年月日"},{"datetime":"年月日时分秒"},{"week":"周"}]},{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":":默认日期",placeholder:'当前日期：new Date()',"tooltip":"可选，选择器打开时默认显示的时间","attrName":":mc-default-value"},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"c":true,"n":"readonly","t":"完全只读","u":false},{"c":true,"n":"disabled","t":"禁用","u":false},{"c":"true","n":":editable","t":"文本框可输入","u":"false"},{"c":"true","n":":clearable","t":"是否显示清除按钮","u":"false"}]},{"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"输入框尺寸","attrName":"size","options":[{"large":""},{"small":"小型"},{"mini":"迷你"}]},{"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"对齐方式","attrName":"align","options":[{"left":"靠左"},{"center":"居中"},{"right":"靠右"}]},{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"提示文本","tooltip":"非范围选择时的占位内容","attrName":"placeholder"},{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"头部图标","tooltip":"自定义头部图标的类名","attrName":"prefix-icon","extendKey":"icon","extend":true},{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"清空图标","tooltip":"自定义清空图标的类名","attrName":"clear-icon","extendKey":"icon","extend":true},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"选择范围时的分隔符","tooltip":"选择范围时的分隔符","attrName":"range-separator"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"范围选择时开始日期的占位内容","tooltip":"范围选择时开始日期的占位内容","attrName":"start-placeholder"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"范围选择时结束日期的占位内容","tooltip":"范围选择时结束日期的占位内容","attrName":"end-placeholder"}]},
                {"title":"事件","active":false,"content":[{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"离开焦点触发事件","attrName":"@blur","extendKey":"method","extend":true,"functionParams":[{"name":"value","title":"当前实例"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"获取焦点触发事件","attrName":"@focus","extendKey":"method","extend":true,"functionParams":[{"name":"value","title":"当前实例"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"变更内容触发事件","attrName":"@change","extendKey":"method","extend":true,"functionParams":[{"name":"value","title":"当前实例"}]}]}
                ]},

        {
            identifier:"mc-mounted",
            properties:{primary:0,name:"页面加载后",dragInto:false,  duplicate:true,duplicateAttr:[],       copy:true,      paste:false,  canDelete:true,dblClickChange:{type:"text"}    },
            attributes: [
                {
                    title:"属性",
                    active:true,
                    content:[
                        {type:"text"      ,clearAttr:true       ,oneLine:true     ,change:"text"  ,title:'文本'                },
                        {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"初始化完成执行事件","attrName":"@mc-mounted","extendKey":"method","extend":true,"functionParams":[{"name":"vueData","title":"页面变量集合"}]}
                    ]
                }
            ],
        },
        {
            identifier:"i",
            properties:{primary:0,name:"图标文字",dragInto:false,  duplicate:true,duplicateAttr:[],       copy:true,      paste:false,  canDelete:true,dblClickChange:{type:"text"}    },
            attributes: [
                {
                    title:"属性",
                    active:true,
                    content:[
                        {type:"text"      ,clearAttr:true       ,oneLine:true     ,change:"text"  ,title:'文本'                },
                        {type:"slider"    ,clearAttr:true       ,oneLine:false    ,change:"style",attrName:'font-size',title:'大小',tooltip:'font-size',extra:{min:0,max:500,suffix:"px"}},
                        {type:"text"      ,clearAttr:false      ,oneLine:true     ,change:"attr",attrName:'class'   ,title:'图标',extendKey:"icon",extend:true    }
                    ]
                }
            ],
        },
       {
          "identifier":"mc-kindeditor",
          "properties":{name:"富文本",dragInto:false,duplicate:false, copy:false,      paste:true,    canDelete:true,assistDelete:true,bind:{":data.sync":"''"},afterResize:{refresh:true}},
          "attributes":[
            {"title":"属性","active":true,"content":[
                  {type:'text'        ,clearAttr:true    ,oneLine:false       ,change:'attr'    ,title:'变量名*' ,attrName:':data.sync',extendKey:"variable"},
                  {type:'text'        ,clearAttr:true    ,oneLine:true        ,change:'attr'    ,title:'上传地址'     ,attrName:'file-upload'},
            ]}
          ]
      },
      {
          "identifier":"mc-kindeditor-view",
          "properties":{name:"预览富文本",dragInto:false,duplicate:false, copy:false,      paste:true,    canDelete:true,assistDelete:true},
          "attributes":[
            {"title":"属性","active":true,"content":[
                  {type:'text'        ,clearAttr:true    ,oneLine:false       ,change:'attr'    ,title:'变量名*' ,attrName:'v-html',extendKey:"variable"},
            ]}
          ]
      },
      {"identifier":"label",
        "properties":{"name":"标题","dragInto":false,"duplicate":true,"copy":true,"paste":false,"canDelete":true,"dblClickChange":{"type":"text"}},
        "attributes":[
          {"title":"属性","active":true,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"text","title":"静态文本"},
            ]}
        ]},
      {"identifier":"mc-checkbox-group",
        "properties":{"name":"多选框组","treeExtraName":{"attr":["v-model"]},"dragInto":true,"duplicate":true,"assistDuplicate":true,"duplicateAttr":[],"copy":true,"paste":true,"canDelete":true,"assistDelete":true,"onlyChildren":["el-checkbox"],"bind":{"v-model":"''"},"assistAdd":true,"addOneItems":[{"":[{"html":"<el-checkbox label='1'>多选项1</el-checkbox>","focus":false}]}]},
        "attributes":[
          {"title":"交互","active":true,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"变量名*","attrName":"v-model","extendKey":"variable"}
              ,CommonUtil.buildMcCondition()]},
          {"title":"属性","content":[
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"尺寸","attrName":"size","options":[{"medium":"中等","small":"小","mini":"迷你"}]},
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"n":"disabled","t":"禁用","c":true,"u":false}]},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"最小选择个数","attrName":":min","extra":{"min":0,"max":100}},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"最大选择个数","attrName":":max","extra":{"min":0,"max":100}},
              {"type":"colorpicker","clearAttr":true,"oneLine":true,"change":"attr","title":"激活时的文本色","attrName":"text-color"},
              {"type":"colorpicker","clearAttr":true,"oneLine":true,"change":"attr","title":"激活时的填充色与边框色","attrName":"fill"}]},

          {"title":"事件","content":[
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"切换触发事件","attrName":"@change","extendKey":"method","extend":true,"functionParams":[{"name":"value","title":"新状态的值"}]}
            ]}]},
      {"identifier":"mc-image-upload",
        "properties":{"name":"文件上传","treeExtraName":{"attr":[":file-list"]},"dragInto":false,"duplicate":true,"assistDuplicate":false,"copy":true,"paste":false,"canDelete":true,"assistDelete":false,"bind":{"v-model":"''"}},
        "attributes":[
          {"title":"交互","active":true,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"变量名*","attrName":"v-model","extendKey":"variable"}
              ,CommonUtil.buildMcCondition()
            ]},

          {"title":"属性","content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"上传地址","attrName":"action"},
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[
                  {"n":"disabled","t":"禁用","c":true,"u":false},
                  {"n":"multiple","t":"多选文件","c":true,"u":false},{"n":"drag","t":"拖拽上传","c":true,"u":false},
                  {"n":":auto-upload","t":"自动上传","c":"true","u":"false"},
                  {"n":"with-credentials","t":"发送cookie","c":true,"u":false},
                  {"n":":show-file-list","t":"显示已上传","c":"true","u":"false"}]},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"最大上传文件个数","attrName":":limit","extra":{"min":0,"max":500}},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"文件列表类型","attrName":"list-type","options":[{"text":"文字","picture":"图片","picture-card":"图片卡片"}]},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"文件类型","attrName":"accept"},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"name","attrName":"name"}]},
        ]},
      {"identifier":"mc-rate",
        "properties":{"name":"评分","treeExtraName":{"attr":["v-model"]},"dragInto":false,"duplicate":true,"assistDuplicate":true,"copy":true,"paste":false,"canDelete":true,"assistDelete":true,"bind":{"v-model":"0"}},
        "attributes":[
          {"title":"交互","active":false,"content":[{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"变量名*","attrName":"v-model","extendKey":"variable"},CommonUtil.buildMcCondition()]},
          {"title":"属性","active":true,"content":[{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"c":true,"n":"disabled","t":"只读","u":false},{"c":true,"n":"allow-half","t":"半选","u":false},{"c":true,"n":"show-text","t":"显示辅助文字","u":false},{"c":true,"n":"show-score","t":"显示当前分数","u":false}]},{"type":"colorpicker","clearAttr":true,"oneLine":true,"change":"attr","title":"未选中颜色","tooltip":"未选中 icon 的颜色","attrName":"void-color"},{"type":"colorpicker","clearAttr":true,"oneLine":true,"change":"attr","title":"只读未选颜色","tooltip":"只读时未选中 icon 的颜色","attrName":"disabled-void-color"},{"type":"colorpicker","clearAttr":true,"oneLine":true,"change":"attr","title":"辅助文字颜色","tooltip":"辅助文字的颜色","attrName":"text-color"},{"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"最大分值","attrName":":max","extra":{"min":0,"max":100}},{"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"低分和中等分数的界限值","tooltip":"低分和中等分数的界限值，值本身被划分在低分中","attrName":":low-threshold","extra":{"min":0,"max":100}},{"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"高分和中等分数的界限值","tooltip":"高分和中等分数的界限值，值本身被划分在高分中","attrName":":high-threshold","extra":{"min":0,"max":100}},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"未选中类名","tooltip":"未选中 icon 的类名","attrName":"void-icon-class","extendKey":"icon","extend":true},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"只读时未选中类名","tooltip":"只读时未选中 icon 的类名","attrName":"disabled-void-icon-class","extendKey":"icon","extend":true},{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"辅助文字数组","attrName":"texts"}]},
        ]},
      {"identifier":"mc-switch",
        "properties":{"name":"开关","treeExtraName":{"attr":["v-model"]},"dragInto":false,"duplicate":true,"duplicateAttr":[],"copy":true,"paste":false,"canDelete":true,"bind":{"v-model":"false"}},
        "attributes":[
          {"title":"属性","active":true,"content":[
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"默认值","options":[{"n":":mc-default-value","t":"开启","c":"true","u":"false","dv":"false"}]},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"宽度","attrName":":width","extra":{"min":0,"max":100}},
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"n":"disabled","t":"是否禁用","c":true,"u":false}]},
              {"type":"colorpicker","clearAttr":true,"oneLine":true,"change":"attr","title":"打开时背景色","attrName":"active-color"},
              {"type":"colorpicker","clearAttr":true,"oneLine":true,"change":"attr","title":"关闭时背景色","attrName":"inactive-color"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"打开时文字描述","attrName":"active-text"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"关闭时文字描述","attrName":"inactive-text"}
            ]
          },
          {"title":"交互","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"变量名*","attrName":"v-model","validate":{"^[a-z][a-zA-Z0-9]*$":"请输入字母数字,驼峰形式"},"extendKey":"variable"}
            ]},
          {"title":"事件","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"切换触发事件","attrName":"@change","extendKey":"method","extend":true,"functionParams":[{"name":"value","title":"新状态的值"}]}
            ]}
        ]
      },
      {"identifier":"mc-remote-tag",
        "properties":{"name":"远程标签","dragInto":false,"duplicate":true,"copy":true,"paste":false,"canDelete":true,"dblClickChange":{"type":"text"}},
        "attributes":[
          {"title":"交互","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"远程接口","attrName":"mc-remote-url"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"文本字段名","attrName":"mc-text-field"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"颜色字段名","attrName":"mc-color-field"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"背景色字段名","attrName":"mc-bg-color-field"},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"几秒自动刷新","attrName":":mc-interval-seconds","extra":{"min":0,"max":3600}},

            ]},
          {"title":"属性","active":true,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"text","title":"静态文本"},
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"c":true,"n":"closable","t":"是否可关闭","u":false},{"c":true,"n":"disable-transitions","t":"是否禁用渐变动画","u":false},{"c":true,"n":"hit","t":"是否有边框描边","u":false}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"类型","attrName":"type","options":[{"success":"成功"},{"info":"信息"},{"warning":"警告"},{"danger":"危险"}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"尺寸","attrName":"size","options":[{"medium":"中型"},{"small":"小型"},{"mini":"迷你"}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"主题","attrName":"effect","options":[{"dark":"暗黑"},{"light":"明亮"},{"plain":"浅白"}]},
              // {"type":"colorpicker","clearAttr":true,"oneLine":true,"change":"attr","title":"背景色","attrName":"color"}
            ]}
        ]},
      {"identifier":"mc-remote-icon",
        "properties":{"name":"远程图标","dragInto":false,"duplicate":true,"copy":true,"paste":false,"canDelete":true,"dblClickChange":{"type":"text"}},
        "attributes":[
          {"title":"交互","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"图标","attrName":"mc-icon","extendKey":"icon","extend":true},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"text","title":"文本"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"远程接口","attrName":"mc-remote-url"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"文本字段名","attrName":"mc-text-field"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"图标字段名","attrName":"mc-icon-field"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"颜色字段名","attrName":"mc-color-field"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"背景色字段名","attrName":"mc-bg-color-field"},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"图标字体","attrName":":mc-font-size","extra":{"min":0,"max":200}},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"几秒自动刷新","attrName":":mc-interval-seconds","extra":{"min":0,"max":3600}},
            ]},
          {"title":"属性","active":true,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"text","title":"静态文本"},
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"c":true,"n":"closable","t":"是否可关闭","u":false},{"c":true,"n":"disable-transitions","t":"是否禁用渐变动画","u":false},{"c":true,"n":"hit","t":"是否有边框描边","u":false}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"类型","attrName":"type","options":[{"success":"成功"},{"info":"信息"},{"warning":"警告"},{"danger":"危险"}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"尺寸","attrName":"size","options":[{"medium":"中型"},{"small":"小型"},{"mini":"迷你"}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"主题","attrName":"effect","options":[{"dark":"暗黑"},{"light":"明亮"},{"plain":"浅白"}]},
              // {"type":"colorpicker","clearAttr":true,"oneLine":true,"change":"attr","title":"背景色","attrName":"color"}
            ]}
        ]},
      {"identifier":"mc-print",
        "properties":{"name":"打印","dragInto":false,"duplicate":true,"copy":true,"paste":false,"canDelete":true,"dblClickChange":{"type":"text"}},
        "attributes":[
          {"title":"属性","active":true,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"text","title":"文本"},
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"c":'true',"n":"canvas","t":"打印Canvas","u":false}]},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"打印区域id","attrName":"print-id"},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"打印区域ref","attrName":"print-ref"},
            ]}
        ]},
      {"identifier":"mc-redirect-button",
        "properties":{"primary":0,"name":"链接按钮","treeExtraName":{"attr":[],"text":true},"dragInto":false,"duplicate":true,"duplicateAttr":[],"copy":true,"paste":false,"canDelete":true,"dblClickChange":{"type":"text"}},
        "attributes":[{"title":"属性","active":true,"content":[
            {"type":"text","clearAttr":true,"oneLine":true,"change":"text","title":"文本"},
            {type:"text"  ,clearAttr:true    ,oneLine:true        ,change:"attr"    ,title:'跳转地址'     ,attrName:'href'},
            {type:"select",clearAttr:true    ,oneLine:true        ,change:"attr"    ,title:'打开方式'     ,attrName:'target',options:[{"_blank":"新窗口","_self":"当前窗口","_parent":"父窗口","_top":"TOP窗口"}]},
            {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"尺寸","attrName":"size","options":[{"medium":"中等","small":"小","mini":"迷你"}]},
            {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"类型","attrName":"type","options":[{"primary":"默认","success":"成功","warning":"警告","danger":"危险","info":"信息","text":"文本"}]},
            {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"n":"plain","t":"朴素","c":true,"u":false},{"n":"round","t":"圆角","c":true,"u":false},{"n":"circle","t":"圆型","c":true,"u":false},{"n":"disabled","t":"禁用","c":true,"u":false},{"n":":loading","t":"加载中","c":"true","u":""},{"n":":autofocus","t":"聚焦","c":"true","u":""}]},
            {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"图标","attrName":"icon","extendKey":"icon","extend":true},
            {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"原生类型","attrName":":native-type","options":[{"button":"普通按钮","submit":"提交","reset":"重置"}]}
          ]},
          {"title":"事件","active":false,"content":[{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"点击触发事件","attrName":"@click","extendKey":"method","extend":true,"functionParams":[{"name":"e","title":"event事件对象"}]}]}]},

      {"identifier":"mc-image","properties":{"name":"图片","treeExtraName":{"attr":["src"]},"dragInto":false,"duplicate":true,"copy":true,"paste":false,"canDelete":true,"bind":{":preview-src-list":"[\"\"]"}},"attributes":[{"title":"属性","active":true,"content":[{"type":"fileupload","clearAttr":true,"oneLine":false,"change":"attr","title":"图片地址","attrName":"src"},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"c":true,"n":"lazy","t":"是否开启懒加载","u":false}]},{"type":"select","clearAttr":true,"oneLine":false,"change":"attr","title":"适应容器框","tooltip":"确定图片如何适应容器框，同原生object-fit","attrName":"fit","options":[{"fill":"填充"},{"contain":"包含"},{"cover":"覆盖"},{"none":"无"},{"scale-down":"缩减"}]},{"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"设置图片预览的 z-index","tooltip":"设置图片预览的 z-index","attrName":"z-index","extra":{"min":0,"max":2000}},{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"原生alt","attrName":"alt"}]},{"title":"交互","active":false,"content":[{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"图片源","tooltip":"图片源，同原生","attrName":":src","extendKey":"variable"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"开启图片预览功能","tooltip":"开启图片预览功能","attrName":":preview-src-list","extendKey":"variable"}]}]},
      {"identifier":"mc-avatar","properties":{"name":"头像","treeExtraName":{"attr":["src"]},"dragInto":false,"duplicate":true,"assistDuplicate":false,"copy":true,"paste":true,"canDelete":true,"assistDelete":false},"attributes":[{"title":"属性","active":true,"content":[{"type":"fileupload","clearAttr":true,"oneLine":false,"change":"attr","title":"图片地址","attrName":"src"},{"type":"select","clearAttr":true,"oneLine":false,"change":"attr","title":"设置头像的形状","tooltip":"设置头像的形状","attrName":"shape","options":[{"circle":"圆形"},{"square":"方形"}]},{"type":"select","clearAttr":true,"oneLine":false,"change":"attr","title":"自适应","tooltip":"当展示类型为图片的时候，设置图片如何适应容器框","attrName":"fit","options":[{"fill":"填充"},{"contain":"包含"},{"cover":"覆盖"},{"none":"无"},{"scale-down":"比例缩减"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"头像图标","tooltip":"设置头像的图标类型，参考 Icon 组件","attrName":"icon","extendKey":"icon","extend":true},{"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"头像大小","attrName":":size","extra":{"min":0,"max":2000}},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"描述图像的替换文本","tooltip":"描述图像的替换文本","attrName":"alt"}]},{"title":"交互","active":false,"content":[{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"地址变量名","attrName":":src","extendKey":"variable"}]}]},
      {"identifier":"mc-a",
        "properties":{"name":"超链接","treeExtraName":{"attr":["url"]},"dragInto":true,"duplicate":true,"assistDuplicate":false,"copy":true,"paste":true,"canDelete":true,"assistDelete":false},
        "attributes":[
          {"title":"属性","active":true,"content":[
              {type:"text",clearAttr:true    ,oneLine:true        ,change:"text"    ,title:'文本' },
              {type:"select",clearAttr:true    ,oneLine:true        ,change:"attr"    ,title:'打开方式'     ,attrName:'target',options:[{"_blank":"新窗口","_self":"当前窗口","_parent":"父窗口","_top":"TOP窗口"}]},
              {
                type:"html",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcPageApp">'+
                      '<div class="layui-col-xs12">'+
                      '   <el-form label-width="80px" size="mini" label-position="left">'+
                      '          <el-form-item label="页面跳转">'+
                      '             <mc-page max-height="300px"  @choose="choose" :project-uuid="projectUuid" :page-uuid="mcTmpData.pageUuid"></mc-page>'+
                      '          </el-form-item>'+
                      '          <el-form-item label=":跳转地址">'+
                      '             <el-input v-model="form.url"></el-input>'+
                      '          </el-form-item>'+
                      '          <el-form-item label="参数1">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck1" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值,一般scope.row.xxx" v-model="form.mcv1"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '          <el-form-item label="参数2">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck2" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值,常量请使用\'\'包裹" v-model="form.mcv2"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '          <el-form-item label="参数3">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck3" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值,支持变量" v-model="form.mcv3"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '          <el-form-item label="参数4" v-if="hideShowVisible">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck4" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值,数字无需\'\'包裹" v-model="form.mcv4"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '          <el-form-item label="参数5" v-if="hideShowVisible">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck5" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值" v-model="form.mcv5"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '          <el-form-item label="参数6" v-if="hideShowVisible">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck6" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值" v-model="form.mcv6"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '          <el-form-item label="参数7" v-if="hideShowVisible">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck7" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值" v-model="form.mcv7"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '          <el-form-item label="参数8" v-if="hideShowVisible">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck8" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值" v-model="form.mcv8"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '          <el-form-item label="参数9" v-if="hideShowVisible">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck9" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值" v-model="form.mcv9"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '          <el-form-item label="参数10" v-if="hideShowVisible">'+
                      '             <el-row><el-col :span="12"><el-input v-model="form.mck10" placeholder="参数名"></el-input></el-col><el-col :span="12"><el-input placeholder=":参数值" v-model="form.mcv10"></el-input></el-col></el-row>'+
                      '          </el-form-item>'+

                      '           <el-form-item>'+
                      '                 <el-button size="mini" @click="hideShowVisible = !hideShowVisible" type="info" icon="el-icon-d-caret">{{hideShowText}}</el-button><el-button size="medium" @click="confirm" type="success">保存配置</el-button>'+
                      '            </el-form-item>'+
                      '   </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var nodeAttr = focusNode.attributes;
                    var mcTmpData = focusNode.attributes[':mc-config-tmp'];
                    if(mcTmpData){
                      mcTmpData = JSON.parse(mcTmpData.replace(/'/g,'"'));
                    }else{
                      mcTmpData = {
                        pageUuid:""
                      }
                    }
                    new Vue({
                      el:"#mcPageApp",
                      data:{
                        projectUuid:projectUuid,
                        mcTmpData:mcTmpData,
                        form:{
                            url:nodeAttr['url'],
                            mck1:nodeAttr['mck1'],mcv1:nodeAttr[':mcv1'],
                            mck2:nodeAttr['mck2'],mcv2:nodeAttr[':mcv2'],
                            mck3:nodeAttr['mck3'],mcv3:nodeAttr[':mcv3'],
                            mck4:nodeAttr['mck4'],mcv4:nodeAttr[':mcv4'],
                            mck5:nodeAttr['mck5'],mcv5:nodeAttr[':mcv5'],
                            mck6:nodeAttr['mck6'],mcv6:nodeAttr[':mcv6'],
                            mck7:nodeAttr['mck7'],mcv7:nodeAttr[':mcv7'],
                            mck8:nodeAttr['mck8'],mcv8:nodeAttr[':mcv8'],
                            mck9:nodeAttr['mck9'],mcv9:nodeAttr[':mcv9'],
                            mck10:nodeAttr['mck10'],mcv10:nodeAttr[':mcv10']
                        },
                        hideShowVisible:false,
                      },
                      computed:{
                          hideShowText:function(){
                            return this.hideShowVisible?"收起":"更多参数"
                          }
                      },
                      mounted:function(){

                      },
                      methods:{
                        choose:function(projectId,pageId){
                          this.mcTmpData.pageUuid = pageId;
                          if(pageId){
                            this.form.url = "publish.html?id="+pageId+"&pid="+projectId;
                          }else{
                            this.form.url = "";
                          }
                        },
                        confirm:function(){
                          //检查配置合法性
                          for(var key in this.form){
                            var value = this.form[key];
                            if(typeof value == 'undefined' || value==''){
                                continue;
                            }
                            var attrName = key;
                            if(key.indexOf("mcv")!=-1){
                              attrName = ":"+attrName;
                            }
                            MAGICAL_CODER_API.changeAttr({node:focusNode,name:attrName,value:value,triggerChange:false})
                          }
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-config-tmp",value:JSON.stringify(this.mcTmpData).replace(/"/g,"'"),triggerChange:true})
                          this.$notify({type:"success",message:"保存成功"})
                        }
                      }
                    })
                  }
                }
              },

            ]
          }
        ]
      },
      {"identifier":"mc-remote-select","properties":{"name":"一级级联下拉框","treeExtraName":{"attr":["v-model"]},"dragInto":false,"duplicate":true,"assistDuplicate":true,"duplicateAttr":[],"copy":true,"paste":false,"canDelete":true,"assistDelete":true,"onlyChildren":["el-option"],"bind":{"v-model":"\"\""},"assistAdd":true,"addOneItems":[{"":[{"html":"<el-option label='选择1' value='1'></el-option>","focus":true}]}]},
        "attributes":[
          {"title":"交互","active":false,"content":[

              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"变量名","attrName":"v-model","extendKey":"variable"},
              {
                type:"html",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcColConfigApp">'+
                      '<div class="layui-col-xs12">数据源</div>'+
                      '<div class="layui-col-xs12">'+
                      '<el-form label-width="120px" size="mini" label-position="left">'+
                      '          <el-form-item label="类型">'+
                      '             <el-select v-model="mcColConfig.type">'+
                      '                 <el-option value="" label="清空"></el-option>'+
                      '                 <el-option value="kv" label="自定义"></el-option>'+
                      '                 <el-option value="pk" label="外键"></el-option>'+
                      '             </el-select>'+
                      '          </el-form-item>'+
                      '          <template v-if="mcColConfig.type==\'kv\'">'+
                      '              <el-form-item label="键值" v-if="!mcColConfig.options || mcColConfig.options.length<=0">'+
                      '                   <el-button size="mini" @click="addParam(0)">新增</el-button>'+
                      '              </el-form-item>'+
                      '              <template v-for="(item,idx) in mcColConfig.options">'+
                      '                 <el-form-item label="键值">'+
                      '                     <el-row>'+
                      '                           <el-col :span="8">'+
                      '                                <el-input v-model="item.k" placeholder="值"/>'+
                      '                           </el-col>'+
                      '                           <el-col :span="8">'+
                      '                                <el-input v-model="item.v" placeholder="标签"/>'+
                      '                           </el-col>'+
                      '                           <el-col :span="8">'+
                      '                                <el-button size="mini" @click="addParam(idx)">+</el-button>'+
                      '                                <el-button size="mini" @click="deleteParam(idx)">-</el-button>'+
                      '                           </el-col>'+
                      '                     </el-row>'+
                      '                 </el-form-item>'+
                      '              </template>'+
                      '          </template>'+
                      '          <template v-else-if="mcColConfig.type==\'pk\'">'+
                      '               <mc-api-origin :data="data" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '               <mc-api :data="mcColConfig.api"  :fields="fields" :show-save-btn="false" :show-fields="true" :show-limit="true"></mc-api>'+
                      '               <el-form-item label="外键查询字段名">'+
                      '                   <el-select v-model="mcColConfig.pkField" filterable allow-create  placeholder="一般为主键">'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="下拉显示字段名">'+
                      '                   <el-select v-model="mcColConfig.pkTextField" filterable allow-create>'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '          </template>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存配置</el-button>'+
                      '            </el-form-item>'+
                      '        </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-config'];
                    var mcTmpData = focusNode.attributes[':mc-config-tmp'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {type:"",options:[],
                        api:{
                          method:"post",//post|get
                          url:"",//
                          params:[],//name入参名 compare:比较符号 value:值 type:number,string
                          fields:[],//返回字段
                          limit:10//限制多少条
                        }
                      };
                    }
                    //兼容下老的配置不然之前配置在params上的就丢失了
                    var oldParams = mcColConfig.api.params;
                    if(oldParams && oldParams.length>0){
                      KCVUtil.toParams(focusNode,mcColConfig.api.params);
                    }
                    //新版统一做法
                    var params = KCVUtil.getParams(focusNode);
                    mcColConfig.api.params = params;

                    if(mcTmpData){
                      mcTmpData = JSON.parse(mcTmpData.replace(/'/g,'"'));
                    }else{
                      mcTmpData = {
                        stage:"db",//api|db
                        apiUuid:"",
                        tableUuid:""
                      }
                    }
                    new Vue({
                      el:"#mcColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig,
                        data:mcTmpData,
                        fields:[]
                      },
                      mounted:function(){

                      },
                      methods:{
                        buildOneParam:function(){
                          return {k:"",v:""}
                        },
                        addParam:function(idx){
                          this.mcColConfig.options.splice(idx+1,0,this.buildOneParam())
                        },
                        deleteParam:function(idx){
                          this.mcColConfig.options.splice(idx,1)
                        },
                        choose:function(val){
                          if(val.stage=='db'){
                            this.fields = val.fields;
                            this.mcColConfig.api.url = "magical_lowcode/openapi/crud/"+val.tableName+"/list";
                          }else{
                            this.fields = [];
                            if(val.apiUuid){
                              this.mcColConfig.api.url = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.api.url = "";
                            }

                          }
                        },
                        confirm:function(){
                          //检查配置合法性
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-config-tmp",value:JSON.stringify(this.data).replace(/"/g,"'"),triggerChange:false})
                          if(this.mcColConfig.type){
                            if(this.mcColConfig.type=='pk'){
                              var api = this.mcColConfig.api;
                              var pkField = this.mcColConfig.pkField;
                              var pkTextField = this.mcColConfig.pkTextField;
                              if(!pkField){
                                this.$notify({type:"error",message:"请配置外键查询字段名，一般为外键的主键"});
                                return;
                              }
                              if(!pkTextField){
                                this.$notify({type:"error",message:"请配置下拉显示字段名，您希望表格显示的外键表字段内容"});
                                return;
                              }
                              if(api){
                                if(!api.url){
                                  this.$notify({type:"error",message:"请配置接口地址"});
                                  return;
                                }
                              }
                            }
                            KCVUtil.toParams(focusNode,this.mcColConfig.api.params);
                            MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true})
                          }else{
                            KCVUtil.toParams(focusNode,this.mcColConfig.api.params);
                            MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-config",value:""})
                          }
                          this.$notify({type:"success",message:"保存成功"})
                        }
                      }
                    })
                  }}
              },
            ]
          },
          {"title":"属性","active":true,"content":[{"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"输入框尺寸","attrName":"size","options":[{"medium":"中等","small":"小型","mini":"迷你"}]},{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"提示文本","attrName":"placeholder"},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"n":"disabled","t":"禁用","c":true,"u":false},{"n":"clearable","t":"清空选项","c":true,"u":false},{"n":"allow-create","t":"创建新条目 ","c":true,"u":false},{"n":"reserve-keyword","t":"保留关键词","c":true,"u":false},{"n":"default-first-option","t":"回车匹配第一个","c":true,"u":false},{"n":"popper-append-to-body","t":"弹框插入body","c":true,"u":false},{"n":"automatic-dropdown","t":"自动弹出菜单","c":true,"u":false}]},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"多选状态","options":[{"n":"multiple","t":"多选","c":true,"u":false},{"n":"collapse-tags","t":"多选时文字展示","c":true,"u":false}]},{"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"多选时最大项目数","attrName":"multiple-limit","extra":{"min":0,"max":100}},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"搜索状态","options":[{"n":"filterable","t":"可搜索","c":true,"u":false},{"n":":loading","t":"加载中","c":"select.loading","u":""}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"自定义搜索方法","attrName":":filter-method"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"远程搜索方法","attrName":":remote-method"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"远程加载时显示的文字","attrName":"loading-text"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"搜索条件无匹配时显示的文字","attrName":"no-match-text"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"选项为空时显示的文字","attrName":"no-data-text"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"下拉框的类名","attrName":"popper-class"}]},
          {"title":"事件","active":false,"content":[{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"离开焦点触发事件","attrName":"@blur","extendKey":"method","extend":true,"functionParams":[{"name":"e","title":"event"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"获取焦点触发事件","attrName":"@focus","extendKey":"method","extend":true,"functionParams":[{"name":"e","title":"event"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"变更内容触发事件","attrName":"@change","extendKey":"method","extend":true,"functionParams":[{"name":"value","title":"当前值"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"清空内容触发事件","attrName":"@clear","extendKey":"method","extend":true,"functionParams":[]}]}
        ]},
        {"identifier":"mc-parent-child-select","properties":{"name":"二级级联下拉框","treeExtraName":{"attr":["v-model"]},"dragInto":false,"duplicate":true,"assistDuplicate":false,"duplicateAttr":[],"copy":true,"paste":false,"canDelete":true,"assistDelete":false,"bind":{":p-model.sync":"\"\"","v-model":"\"\""} },
        "attributes":[
          {"title":"交互","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"父亲变量名","attrName":":p-model.sync","extendKey":"variable",category:"第一个下拉框"},
               {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"标题","attrName":"mc-parent-comment","extendKey":"variable",category:"第一个下拉框"},
              {
                type:"html",category:"第一个下拉框",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcParentColConfigApp">'+
                      '<div class="layui-col-xs12">'+
                      '        <el-form label-width="120px" size="mini" label-position="left">'+
                      '               <mc-api-origin :data="mcColConfig.tmp" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '               <mc-api :data="mcColConfig.api"  :fields="fields" :show-save-btn="false" :show-fields="true" :show-limit="true"></mc-api>'+
                      '               <el-form-item label="外键查询字段名">'+
                      '                   <el-select v-model="mcColConfig.pkField" filterable allow-create placeholder="一般为主键">'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="下拉显示字段名">'+
                      '                   <el-select v-model="mcColConfig.pkTextField" filterable allow-create>'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存第一个配置</el-button>'+
                      '            </el-form-item>'+
                      '        </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-parent-config'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {
                        api:{
                          method:"post",//post|get
                          url:"",//
                          params:[],//name入参名 compare:比较符号 value:值 type:number,string
                          fields:[],//返回字段
                          limit:10//限制多少条
                        },
                        tmp:{
                          stage:"db",//api|db
                          apiUuid:"",
                          tableUuid:""
                        }
                      };
                    }

                    //新版统一做法
                    var params = KCVUtil.getParams(focusNode,'p');
                    mcColConfig.api.params = params;

                    new Vue({
                      el:"#mcParentColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig,
                        fields:[]
                      },
                      methods:{
                        choose:function(val){
                          if(val.stage=='db'){
                            this.fields = val.fields;
                            this.mcColConfig.api.url = "magical_lowcode/openapi/crud/"+val.tableName+"/list";
                          }else{
                            this.fields = [];
                            if(val.apiUuid){
                              this.mcColConfig.api.url = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.api.url = "";
                            }
                          }
                        },
                        confirm:function(){
                              var api = this.mcColConfig.api;
                              var pkField = this.mcColConfig.pkField;
                              var pkTextField = this.mcColConfig.pkTextField;
                              if(!pkField){
                                this.$notify({type:"error",message:"请配置外键查询字段名，一般为外键的主键"});
                                return;
                              }
                              if(!pkTextField){
                                this.$notify({type:"error",message:"请配置下拉显示字段名，您希望表格显示的外键表字段内容"});
                                return;
                              }
                              if(api){
                                if(!api.url){
                                  this.$notify({type:"error",message:"请配置接口地址"});
                                  return;
                                }
                              }
                              KCVUtil.toParams(focusNode,this.mcColConfig.api.params,'p');
                              MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-parent-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true});
                              this.$notify({type:"success",message:"保存成功"})
                        }
                      }
                    })//vue

                  }}
              },//type
               {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"孩子变量名","attrName":"v-model","extendKey":"variable",category:"第二个下拉框"},
               {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"标题","attrName":"mc-child-comment","extendKey":"variable",category:"第二个下拉框"},
              {
                type:"html",category:"第二个下拉框",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcChildColConfigApp">'+
                      '<div class="layui-col-xs12">'+
                      '        <el-form label-width="120px" size="mini" label-position="left">'+
                      '               <mc-api-origin :data="mcColConfig.tmp" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '               <mc-api :data="mcColConfig.api"  :fields="fields" :show-save-btn="false" :show-fields="true" :show-limit="true"></mc-api>'+
                      '               <el-form-item label="外键查询字段名">'+
                      '                   <el-select v-model="mcColConfig.pkField" filterable allow-create placeholder="一般为主键">'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="下拉显示字段名">'+
                      '                   <el-select v-model="mcColConfig.pkTextField" filterable allow-create>'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="外键父亲字段名">'+
                      '                   <el-select v-model="mcColConfig.parentField" filterable allow-create>'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存第二个配置</el-button>'+
                      '            </el-form-item>'+
                      '        </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-child-config'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {
                        api:{
                          method:"post",//post|get
                          url:"",//
                          params:[],//name入参名 compare:比较符号 value:值 type:number,string
                          fields:[],//返回字段
                          limit:10//限制多少条
                        },
                        tmp:{
                          stage:"db",//api|db
                          apiUuid:"",
                          tableUuid:""
                        }
                      };
                    }
                    //新版统一做法
                    var params = KCVUtil.getParams(focusNode,'c');
                    mcColConfig.api.params = params;

                    new Vue({
                      el:"#mcChildColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig,
                        fields:[]
                      },
                      methods:{
                        choose:function(val){
                          if(val.stage=='db'){
                            this.fields = val.fields;
                            this.mcColConfig.api.url = "magical_lowcode/openapi/crud/"+val.tableName+"/list";
                          }else{
                            this.fields = [];
                            if(val.apiUuid){
                              this.mcColConfig.api.url = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.api.url = "";
                            }
                          }
                        },
                        confirm:function(){
                              var api = this.mcColConfig.api;
                              var pkField = this.mcColConfig.pkField;
                              var pkTextField = this.mcColConfig.pkTextField;
                              var parentField = this.mcColConfig.parentField;
                              if(!pkField){
                                this.$notify({type:"error",message:"请配置外键查询字段名，一般为外键的主键"});
                                return;
                              }
                              if(!pkTextField){
                                this.$notify({type:"error",message:"请配置下拉显示字段名，您希望表格显示的外键表字段内容"});
                                return;
                              }
                              if(!parentField){
                                this.$notify({type:"error",message:"请配置外键父亲字段名，当前孩子根据此字段与父亲表关联"});
                                return;
                              }
                              if(api){
                                if(!api.url){
                                  this.$notify({type:"error",message:"请配置接口地址"});
                                  return;
                                }
                              }
                              KCVUtil.toParams(focusNode,this.mcColConfig.api.params,'c');
                              MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-child-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true});
                              this.$notify({type:"success",message:"保存成功"})
                        }
                      }
                    })//vue

                  }}
              },//type
            ]
          },
          {"title":"属性","active":true,"content":[{"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"输入框尺寸","attrName":"size","options":[{"medium":"中等","small":"小型","mini":"迷你"}]},{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"提示文本","attrName":"placeholder"},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"n":"disabled","t":"禁用","c":true,"u":false},{"n":"clearable","t":"清空选项","c":true,"u":false},{"n":"allow-create","t":"创建新条目 ","c":true,"u":false},{"n":"reserve-keyword","t":"保留关键词","c":true,"u":false},{"n":"default-first-option","t":"回车匹配第一个","c":true,"u":false},{"n":"popper-append-to-body","t":"弹框插入body","c":true,"u":false},{"n":"automatic-dropdown","t":"自动弹出菜单","c":true,"u":false}]},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"多选状态","options":[{"n":"multiple","t":"多选","c":true,"u":false},{"n":"collapse-tags","t":"多选时文字展示","c":true,"u":false}]},{"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"多选时最大项目数","attrName":"multiple-limit","extra":{"min":0,"max":100}},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"搜索状态","options":[{"n":"filterable","t":"可搜索","c":true,"u":false},{"n":":loading","t":"加载中","c":"select.loading","u":""}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"自定义搜索方法","attrName":":filter-method"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"远程搜索方法","attrName":":remote-method"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"远程加载时显示的文字","attrName":"loading-text"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"搜索条件无匹配时显示的文字","attrName":"no-match-text"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"选项为空时显示的文字","attrName":"no-data-text"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"下拉框的类名","attrName":"popper-class"}]},
          {"title":"事件","active":false,"content":[{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"离开焦点触发事件","attrName":"@blur","extendKey":"method","extend":true,"functionParams":[{"name":"e","title":"event"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"获取焦点触发事件","attrName":"@focus","extendKey":"method","extend":true,"functionParams":[{"name":"e","title":"event"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"变更内容触发事件","attrName":"@change","extendKey":"method","extend":true,"functionParams":[{"name":"value","title":"当前值"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"清空内容触发事件","attrName":"@clear","extendKey":"method","extend":true,"functionParams":[]}]}
        ]},
        {"identifier":"mc-parent-child-grandson-select","properties":{"name":"三级级联下拉框","treeExtraName":{"attr":["v-model"]},"dragInto":false,"duplicate":true,"assistDuplicate":false,"duplicateAttr":[],"copy":true,"paste":false,"canDelete":true,"assistDelete":false,"bind":{":p-model.sync":"\"\"",":c-model.sync":"\"\"","v-model":"\"\""} },
        "attributes":[
          {"title":"交互","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"变量名","attrName":":p-model.sync","extendKey":"variable",category:"第一个下拉"},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"标题","attrName":"mc-parent-comment","extendKey":"variable",category:"第一个下拉"},
              {
                type:"html",category:"第一个下拉",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcParentColConfigApp">'+
                      '<div class="layui-col-xs12">'+
                      '        <el-form label-width="120px" size="mini" label-position="left">'+
                      '               <mc-api-origin :data="mcColConfig.tmp" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '               <mc-api :data="mcColConfig.api"  :fields="fields" :show-save-btn="false" :show-fields="true" :show-limit="true"></mc-api>'+
                      '               <el-form-item label="外键查询字段名">'+
                      '                   <el-select v-model="mcColConfig.pkField" filterable allow-create placeholder="一般为主键">'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="下拉显示字段名">'+
                      '                   <el-select v-model="mcColConfig.pkTextField" filterable allow-create>'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存第一个配置</el-button>'+
                      '            </el-form-item>'+
                      '        </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-parent-config'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {
                        api:{
                          method:"post",//post|get
                          url:"",//
                          params:[],//name入参名 compare:比较符号 value:值 type:number,string
                          fields:[],//返回字段
                          limit:10//限制多少条
                        },
                        tmp:{
                          stage:"db",//api|db
                          apiUuid:"",
                          tableUuid:""
                        }
                      };
                    }
                    //新版统一做法
                    var params = KCVUtil.getParams(focusNode,'p');
                    mcColConfig.api.params = params;
                    new Vue({
                      el:"#mcParentColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig,
                        fields:[]
                      },
                      methods:{
                        choose:function(val){
                          if(val.stage=='db'){
                            this.fields = val.fields;
                            this.mcColConfig.api.url = "magical_lowcode/openapi/crud/"+val.tableName+"/list";
                          }else{
                            this.fields = [];
                            if(val.apiUuid){
                              this.mcColConfig.api.url = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.api.url = "";
                            }
                          }
                        },
                        confirm:function(){
                              var api = this.mcColConfig.api;
                              var pkField = this.mcColConfig.pkField;
                              var pkTextField = this.mcColConfig.pkTextField;
                              if(!pkField){
                                this.$notify({type:"error",message:"请配置外键查询字段名，一般为外键的主键"});
                                return;
                              }
                              if(!pkTextField){
                                this.$notify({type:"error",message:"请配置下拉显示字段名，您希望表格显示的外键表字段内容"});
                                return;
                              }
                              if(api){
                                if(!api.url){
                                  this.$notify({type:"error",message:"请配置接口地址"});
                                  return;
                                }
                              }
                          KCVUtil.toParams(focusNode,this.mcColConfig.api.params,'p');
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-parent-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true})
                          this.$notify({type:"success",message:"保存成功"})
                        }
                      }
                    })//vue

                  }}
              },//type
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"变量名","attrName":":c-model.sync","extendKey":"variable",category:"第二个下拉"},
               {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"标题","attrName":"mc-child-comment",category:"第二个下拉"},
              {
                type:"html",category:"第二个下拉",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcChildColConfigApp">'+
                      '<div class="layui-col-xs12">'+
                      '        <el-form label-width="120px" size="mini" label-position="left">'+
                      '               <mc-api-origin :data="mcColConfig.tmp" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '               <mc-api :data="mcColConfig.api"  :fields="fields" :show-save-btn="false" :show-fields="true" :show-limit="true"></mc-api>'+
                      '               <el-form-item label="外键查询字段名">'+
                      '                   <el-select v-model="mcColConfig.pkField" filterable allow-create placeholder="一般为主键">'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="下拉显示字段名">'+
                      '                   <el-select v-model="mcColConfig.pkTextField" filterable allow-create>'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="外键父亲字段名">'+
                      '                   <el-select v-model="mcColConfig.parentField" filterable allow-create placeholder="一般为关联的前一个下拉的外键字段">'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '           <el-form-item>'+
                      '                 <el-button @click="confirm" size="medium" class="flow-right-bottom" @click="confirm" type="success">保存第二个配置</el-button>'+
                      '            </el-form-item>'+
                      '        </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-child-config'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {
                        api:{
                          method:"post",//post|get
                          url:"",//
                          params:[],//name入参名 compare:比较符号 value:值 type:number,string
                          fields:[],//返回字段
                          limit:10//限制多少条
                        },
                        tmp:{
                          stage:"db",//api|db
                          apiUuid:"",
                          tableUuid:""
                        }
                      };
                    }
                    //新版统一做法
                    var params = KCVUtil.getParams(focusNode,'c');
                    mcColConfig.api.params = params;
                    new Vue({
                      el:"#mcChildColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig,
                        fields:[]
                      },
                      methods:{
                        choose:function(val){
                          if(val.stage=='db'){
                            this.fields = val.fields;
                            this.mcColConfig.api.url = "magical_lowcode/openapi/crud/"+val.tableName+"/list";
                          }else{
                            this.fields = [];
                            if(val.apiUuid){
                              this.mcColConfig.api.url = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.api.url = "";
                            }
                          }
                        },
                        confirm:function(){
                              var api = this.mcColConfig.api;
                              var pkField = this.mcColConfig.pkField;
                              var pkTextField = this.mcColConfig.pkTextField;
                              var parentField = this.mcColConfig.parentField;
                              if(!pkField){
                                this.$notify({type:"error",message:"请配置外键查询字段名，一般为外键的主键"});
                                return;
                              }
                              if(!pkTextField){
                                this.$notify({type:"error",message:"请配置下拉显示字段名，您希望表格显示的外键表字段内容"});
                                return;
                              }
                              if(!parentField){
                                this.$notify({type:"error",message:"请配置外键父亲字段名，当前孩子根据此字段与父亲表关联"});
                                return;
                              }
                              if(api){
                                if(!api.url){
                                  this.$notify({type:"error",message:"请配置接口地址"});
                                  return;
                                }
                              }
                          KCVUtil.toParams(focusNode,this.mcColConfig.api.params,'c');
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-child-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true});
                          this.$notify({type:"success",message:"保存成功"});
                        }
                      }
                    })//vue

                  }}
              },//type
               {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"变量名","attrName":"v-model","extendKey":"variable",category:"第三个下拉"},
               {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"标题","attrName":"mc-grandson-comment","extendKey":"variable",category:"第三个下拉"},
              {
                type:"html",category:"第三个下拉",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcGrandsonColConfigApp">'+
                      '<div class="layui-col-xs12">'+
                      '        <el-form label-width="120px" size="mini" label-position="left">'+
                      '               <mc-api-origin :data="mcColConfig.tmp" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '               <mc-api :data="mcColConfig.api"  :fields="fields" :show-save-btn="false" :show-fields="true" :show-limit="true"></mc-api>'+
                      '               <el-form-item label="外键查询字段名">'+
                      '                   <el-select v-model="mcColConfig.pkField" filterable allow-create placeholder="一般为主键">'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="下拉显示字段名">'+
                      '                   <el-select v-model="mcColConfig.pkTextField" filterable allow-create>'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="外键父亲字段名">'+
                      '                   <el-select v-model="mcColConfig.parentField" filterable allow-create  placeholder="一般为关联的前一个下拉的外键字段">'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存第三个配置</el-button>'+
                      '            </el-form-item>'+
                      '        </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-grandson-config'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {
                        api:{
                          method:"post",//post|get
                          url:"",//
                          params:[],//name入参名 compare:比较符号 value:值 type:number,string
                          fields:[],//返回字段
                          limit:10//限制多少条
                        },
                        tmp:{
                          stage:"db",//api|db
                          apiUuid:"",
                          tableUuid:""
                        }
                      };
                    }
                    //新版统一做法
                    var params = KCVUtil.getParams(focusNode,'g');
                    mcColConfig.api.params = params;
                    new Vue({
                      el:"#mcGrandsonColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig,
                        fields:[]
                      },
                      methods:{
                        choose:function(val){
                          if(val.stage=='db'){
                            this.fields = val.fields;
                            this.mcColConfig.api.url = "magical_lowcode/openapi/crud/"+val.tableName+"/list";
                          }else{
                            this.fields = [];
                            if(val.apiUuid){
                              this.mcColConfig.api.url = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.api.url = "";
                            }
                          }
                        },
                        confirm:function(){
                              var api = this.mcColConfig.api;
                              var pkField = this.mcColConfig.pkField;
                              var pkTextField = this.mcColConfig.pkTextField;
                              var parentField = this.mcColConfig.parentField;
                              if(!pkField){
                                this.$notify({type:"error",message:"请配置外键查询字段名，一般为外键的主键"});
                                return;
                              }
                              if(!pkTextField){
                                this.$notify({type:"error",message:"请配置下拉显示字段名，您希望表格显示的外键表字段内容"});
                                return;
                              }
                              if(!parentField){
                                this.$notify({type:"error",message:"请配置外键父亲字段名，当前孩子根据此字段与父亲表关联"});
                                return;
                              }
                              if(api){
                                if(!api.url){
                                  this.$notify({type:"error",message:"请配置接口地址"});
                                  return;
                                }
                              }
                          KCVUtil.toParams(focusNode,this.mcColConfig.api.params,'g');
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-grandson-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true});
                          this.$notify({type:"success",message:"保存成功"});
                        }
                      }
                    })//vue

                  }}
              },//type

            ]
          },
          {"title":"属性","active":true,"content":[{"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"输入框尺寸","attrName":"size","options":[{"medium":"中等","small":"小型","mini":"迷你"}]},{"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"提示文本","attrName":"placeholder"},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"n":"disabled","t":"禁用","c":true,"u":false},{"n":"clearable","t":"清空选项","c":true,"u":false},{"n":"allow-create","t":"创建新条目 ","c":true,"u":false},{"n":"reserve-keyword","t":"保留关键词","c":true,"u":false},{"n":"default-first-option","t":"回车匹配第一个","c":true,"u":false},{"n":"popper-append-to-body","t":"弹框插入body","c":true,"u":false},{"n":"automatic-dropdown","t":"自动弹出菜单","c":true,"u":false}]},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"多选状态","options":[{"n":"multiple","t":"多选","c":true,"u":false},{"n":"collapse-tags","t":"多选时文字展示","c":true,"u":false}]},{"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"多选时最大项目数","attrName":"multiple-limit","extra":{"min":0,"max":100}},{"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"搜索状态","options":[{"n":"filterable","t":"可搜索","c":true,"u":false},{"n":":loading","t":"加载中","c":"select.loading","u":""}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"自定义搜索方法","attrName":":filter-method"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"远程搜索方法","attrName":":remote-method"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"远程加载时显示的文字","attrName":"loading-text"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"搜索条件无匹配时显示的文字","attrName":"no-match-text"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"选项为空时显示的文字","attrName":"no-data-text"},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"下拉框的类名","attrName":"popper-class"}]},
          {"title":"事件","active":false,"content":[{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"离开焦点触发事件","attrName":"@blur","extendKey":"method","extend":true,"functionParams":[{"name":"e","title":"event"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"获取焦点触发事件","attrName":"@focus","extendKey":"method","extend":true,"functionParams":[{"name":"e","title":"event"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"变更内容触发事件","attrName":"@change","extendKey":"method","extend":true,"functionParams":[{"name":"value","title":"当前值"}]},{"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"清空内容触发事件","attrName":"@clear","extendKey":"method","extend":true,"functionParams":[]}]}
        ]},
      {"identifier":"mc-el-row",
        "properties":{"name":"列表","canZoom":true,"assistZoom":true,"dragInto":true,"duplicate":true,"assistDuplicate":true,"duplicateAttr":[],"copy":true,"paste":false,"canDelete":true,"assistDelete":true,"onlyChildren":["mc-el-col"],"assistAdd":false},
        "attributes":[
          {
            title:"数据源",active: true,content: [
              {
                type:"html",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcColConfigApp">'+
                      '<div class="layui-col-xs12">'+
                      '   <el-form label-width="120px" size="mini" label-position="left">'+
                      '     <mc-api-origin :data="mcColConfig.tmp" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '     <mc-api :data="mcColConfig"  :fields="fields" :show-save-btn="false" :show-fields="true" :show-limit="true"></mc-api>'+
                      '     <el-form-item label="隔几秒刷新" title="发布页可预览效果"><el-input-number v-model="mcColConfig.mcIntervalSeconds"></el-input-number></el-form-item>'+
                      '     <el-form-item label="监控刷新变量" title="交互联动功能"><el-input v-model="mcColConfig.watch" placeholder="逗号分隔多个变量名"></el-input></el-form-item>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存配置</el-button>'+
                      '            </el-form-item>'+
                      '   </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-config'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {'url':'','method':'post','params':[],'fields':[],tmp:{stage:"db",apiUuid:"",tableUuid:""},mcIntervalSeconds:0,watch:""}
                    }
                    //兼容下老的配置不然之前配置在params上的就丢失了
                    var oldParams = mcColConfig.params;
                    if(oldParams && oldParams.length>0){
                      KCVUtil.toParams(focusNode,mcColConfig.params);
                    }
                    //新版统一做法
                    var params = KCVUtil.getParams(focusNode);
                    mcColConfig.params = params;
                    new Vue({
                      el:"#mcColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig,
                        fields:[]
                      },
                      mounted:function(){

                      },
                      methods:{
                        choose:function(val){
                          if(val.stage=='db'){
                            this.fields = val.fields;
                            this.mcColConfig.url = "magical_lowcode/openapi/crud/"+val.tableName+"/list";
                          }else{
                            this.fields = [];
                            if(val.apiUuid){
                              this.mcColConfig.url = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.url = "";
                            }

                          }
                        },
                        confirm:function(){
                          KCVUtil.toParams(focusNode,this.mcColConfig.params);
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true});
                          this.$notify({type:"success",message:"保存成功"});
                        }
                      }
                    })
                  }}
              }
            ]
          },
          {
            title:"滚动",active: true,content: [
              {
                type:"html",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcScrollApp">'+
                      '<div class="layui-col-xs12">'+
                      '   <el-form label-width="120px" size="mini" label-position="left">'+
                      '     <mc-scroll-config :data="mcColConfig"></mc-scroll-config>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存配置</el-button>'+
                      '            </el-form-item>'+
                      '   </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-scroll'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {open:false,direction:0,hoverStop:true}
                    }
                    new Vue({
                      el:"#mcScrollApp",
                      data:{
                        mcColConfig:mcColConfig
                      },
                      mounted:function(){

                      },
                      methods:{
                        confirm:function(){
                          //检查配置合法性
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-scroll",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true});
                          this.$notify({type:"success",message:"保存成功"});
                        }
                      }
                    })
                  }}
              }
            ]
          },
          {"title":"属性","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"循环遍历对象语句","attrName":"v-for","placeholder":"格式:(item,_vForIndex) in myList"},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"栅格间隔","attrName":":gutter","extra":{"min":0,"max":2000},"extend":true},
              {"type":"checkbox","clearAttr":true,"oneLine":false,"change":"attr","title":"布局模式(现代浏览器下有效)","options":[{"n":"type","t":"FLEX","c":"flex","u":""}]},
              {"type":"select","clearAttr":true,"oneLine":false,"change":"attr","title":"水平对齐(当FLEX模式选中时有效)","attrName":"justify","options":[{"start":"头部"},{"end":"尾部"},{"center":"居中"},{"space-around":"环绕"},{"space-between":"间隔"}]},
              {"type":"select","clearAttr":true,"oneLine":false,"change":"attr","title":"垂直对齐(当FLEX模式选中时有效)","attrName":"align","options":[{"top":"顶部对齐"},{"middle":"居中对齐"},{"bottom":"底部对齐"}]},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"自定义元素标签","attrName":"tag","defaultValue":""}
            ]}]},
      {"identifier":"mc-el-col",
        "properties":{"name":"列表条目",canNotOperate:true,"canZoom":true,"assistZoom":true,"dragInto":true,"duplicate":false,"assistDuplicate":false,"duplicateAttr":[],"copy":false,"paste":true,"canDelete":false,"assistDelete":false,"onlyParents":["mc-el-row"],"bind":{"v-text":"\"\"","v-html":"\"\"","v-for":"[]"},"dblClickChange":{"type":"text"}},
        "attributes":[
          {"title":"属性","active":true,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"text","title":"文本"},
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"class","title":"自由定位","options":[{"c":"mc-ui-absolute-pane","n":"","t":"是否开启","u":""}]},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"栅格占据的列数","attrName":":span","extra":{"min":0,"max":24}},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"栅格左侧的间隔格数","attrName":":offset","extra":{"min":0,"max":24}},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"栅格向右移动格数","attrName":":push","extra":{"min":0,"max":24}},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"栅格向左移动格数","attrName":":pull","extra":{"min":0,"max":24}},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"xs栅格数","attrName":":xs","extra":{"min":0,"max":24},"responsive":"xs"},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"sm栅格数","attrName":":sm","extra":{"min":0,"max":24},"responsive":"sm"},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"md栅格数","attrName":":md","extra":{"min":0,"max":24},"responsive":"md"},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"lg栅格数","attrName":":lg","extra":{"min":0,"max":24},"responsive":"lg"},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"xl栅格数","attrName":":xl","extra":{"min":0,"max":24},"responsive":"xl"},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"自定义元素标签","attrName":":tag"}
            ]}]},
      {"identifier":"mc-questionnaire",
        "properties":{"name":"问卷表单","canZoom":true,"assistZoom":true,"dragInto":false,"duplicate":true,"assistDuplicate":true,"duplicateAttr":[],"copy":true,"paste":false,"canDelete":true,"assistDelete":true,"onlyChildren":["el-col"],"assistAdd":true,"addOneItems":[{"#body":[{"html":"<el-col :span='24' class='mc-ui-absolute-pane'  mcstyle='ab-unit-top:px'></el-col>","focus":false}]}]},
        "attributes":[
          {
            title:"数据源",active: true,content: [
              {
                type:"html",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcColConfigApp">'+
                      '<div class="layui-col-xs12">'+
                      '   <el-form label-width="120px" size="mini" label-position="left">'+
                      '     <mc-api-origin :data="mcColConfig.tmp" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '     <el-form-item label="保存地址"><el-input v-model="mcColConfig.saveUrl"></el-input></el-form-item>'+
                      '     <el-form-item label="恢复地址"><el-input v-model="mcColConfig.getUrl"></el-input></el-form-item>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存配置</el-button>'+
                      '            </el-form-item>'+
                      '   </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-config'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {'saveUrl':'','getUrl':'',tmp:{stage:"db",apiUuid:"",tableUuid:"",fields:[]}}
                    }
                    new Vue({
                      el:"#mcColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig
                      },
                      mounted:function(){

                      },
                      methods:{
                        choose:function(val){
                          if(val.stage=='db'){
                            this.mcColConfig.tmp.fields = val.fields;
                            this.mcColConfig.saveUrl = "magical_lowcode/openapi/crud/"+val.tableName+"/save";
                            this.mcColConfig.getUrl = "magical_lowcode/openapi/crud/"+val.tableName+"/my-list";
                          }else{
                            this.mcColConfig.tmp.fields = [];
                            if(val.apiUuid){
                              this.mcColConfig.saveUrl = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.saveUrl = "";
                            }

                          }
                        },
                        confirm:function(){
                          //检查配置合法性
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true});
                          this.$notify({type:"success",message:"保存成功"});
                        }
                      }
                    })
                  }}
              }
            ]
          },
          {"title":"属性","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"循环遍历对象语句","attrName":"v-for","placeholder":"格式:(item,_vForIndex) in myList"},
              {"type":"slider","clearAttr":true,"oneLine":false,"change":"attr","title":"栅格间隔","attrName":":gutter","extra":{"min":0,"max":2000},"extend":true},
              {"type":"checkbox","clearAttr":true,"oneLine":false,"change":"attr","title":"布局模式(现代浏览器下有效)","options":[{"n":"type","t":"FLEX","c":"flex","u":""}]},
              {"type":"select","clearAttr":true,"oneLine":false,"change":"attr","title":"水平对齐(当FLEX模式选中时有效)","attrName":"justify","options":[{"start":"头部"},{"end":"尾部"},{"center":"居中"},{"space-around":"环绕"},{"space-between":"间隔"}]},
              {"type":"select","clearAttr":true,"oneLine":false,"change":"attr","title":"垂直对齐(当FLEX模式选中时有效)","attrName":"align","options":[{"top":"顶部对齐"},{"middle":"居中对齐"},{"bottom":"底部对齐"}]},
              {"type":"text","clearAttr":true,"oneLine":false,"change":"attr","title":"自定义元素标签","attrName":"tag","defaultValue":""}
            ]}]},
      {"identifier":"mc-pk-creator",
        "properties":{"name":"生成主键","canZoom":true,"assistZoom":true,"dragInto":false,"duplicate":true,"assistDuplicate":true,"duplicateAttr":[],"copy":true,"paste":false,"canDelete":true},
        "attributes":[
          {
            title:"数据源",active: true,content: [
              {
                type:"html",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcColConfigApp">'+
                      '<div class="layui-col-xs12">'+
                      '   <el-form label-width="120px" size="mini" label-position="left">'+
                      '     <mc-api-origin :data="mcColConfig.tmp" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '     <el-form-item label="新增地址"><el-input v-model="mcColConfig.insertUrl"></el-input></el-form-item>'+
                      '     <el-form-item label="跳转地址"><el-input v-model="mcColConfig.redirectUrl"></el-input></el-form-item>'+
                      '     <el-form-item label="跳转方式"><el-select v-model="mcColConfig.target"><el-option label="当前页面" value="_self"></el-option><el-option label="新页面" value="_blank"></el-option></el-select></el-form-item>'+
                      '     <el-form-item label="参数名"><el-input v-model="mcColConfig.paramName"></el-input></el-form-item>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存配置</el-button>'+
                      '           </el-form-item>'+
                      '   </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-config'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {'insertUrl':'','redirectUrl':'',target:"_self",paramName:"pk",tmp:{stage:"db",apiUuid:"",tableUuid:""}}
                    }
                    new Vue({
                      el:"#mcColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig
                      },
                      mounted:function(){

                      },
                      methods:{
                        choose:function(val){
                          if(val.stage=='db'){
                            this.mcColConfig.insertUrl = "magical_lowcode/openapi/crud/"+val.tableName+"/insert";
                          }else{
                            if(val.apiUuid){
                              this.mcColConfig.insertUrl = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.insertUrl = "";
                            }

                          }
                        },
                        confirm:function(){
                          //检查配置合法性
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true});
                          this.$notify({type:"success",message:"保存成功"})
                        }
                      }
                    })
                  }}
              }
            ]
          },
          {"title":"属性","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"text","title":"文本"},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"尺寸","attrName":"size","options":[{"medium":"中等","small":"小","mini":"迷你"}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"类型","attrName":"type","options":[{"primary":"默认","success":"成功","warning":"警告","danger":"危险","info":"信息","text":"文本"}]},
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[{"n":"plain","t":"朴素","c":true,"u":false},{"n":"round","t":"圆角","c":true,"u":false},{"n":"circle","t":"圆型","c":true,"u":false},{"n":"disabled","t":"禁用","c":true,"u":false},{"n":":loading","t":"加载中","c":"true","u":""},{"n":":autofocus","t":"聚焦","c":"true","u":""}]},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"图标","attrName":"icon","extendKey":"icon","extend":true},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"原生类型","attrName":":native-type","options":[{"button":"普通按钮","submit":"提交","reset":"重置"}]}
            ]}
        ]
      },
      {
        "identifier":"mc-new-vxe-table",
        "properties":{
          "primary":0,
          "name":"智能表格",
          "dragInto":false,
          "onlyChildren":["vxe-table-column","mc-new-vxe-table-column","template"],
          "addOneItems":[{"":[{"html":'<mc-new-vxe-table-column title="标题" field="id"></mc-new-vxe-table-column>',"focus":false}]}],
          "duplicate":false,
          "duplicateAttr":[],
          "copy":true,
          "paste":false,
          "canDelete":true,
        },
        "attributes":[
          {
            "title":"数据源",
            "active":true,
            "content":[
              {type:"html",
                callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcDbTableApp">'+
                      '<div class="layui-col-xs3">选择表</div>'+
                      '<div class="layui-col-xs9">'+
                      '<el-tag effect="plain" @click="openDrawer">快速配置</el-tag>'+
                      '<el-drawer style="overflow-y:scroll" title="选择表" :visible.sync="drawer" direction="rtl" :modal="false" size="300px">'+
                      '<el-tree  node-key="uuid" ref="selectTree" :data="treeList" default-expand-all @node-click="handleNodeClick" :props="defaultProps"></el-tree>'+
                      '</el-drawer>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    //从magicalCoder获取当前聚焦节点的属性值 准备传入vue里
                    var config = param.config,focusNode=param.focusNode;
                    new Vue({
                      el: '#mcDbTableApp',
                      data: {
                        treeList:[],
                        defaultProps: {
                          children: 'children',
                          label: 'name',
                        },
                        drawer : false,
                      },
                      mounted:function(){

                      },
                      methods:{
                        handleNodeClick:function(data,node){
                          if(node.level==1){
                            return;//数据库不用管
                          }
                          var databaseUuid = '';
                          for(var i=0;i<this.treeList.length;i++){
                            var children = this.treeList[i].children;
                            for(var j=0;j<children.length;j++){
                              if(children[j].uuid == data.uuid){
                                databaseUuid=this.treeList[i].uuid;
                                break;
                              }
                            }
                          }
                          var tableName = data.name;
                          var _t = this;
                          CommonUtil.axiosWithServerName("get","/magical_lowcode/user/table/info",
                            {
                              params: {
                                projectUuid:projectUuid,
                                databaseUuid:databaseUuid,
                                uuid:data.uuid,
                              }
                            },function(response){
                              //填充预定的后端接口
                              focusNode.attributes['mc-query-url'] = "magical_lowcode/openapi/crud/"+tableName+"/page" ;
                              focusNode.attributes['mc-save-url'] = "magical_lowcode/openapi/crud/"+tableName+"/save" ;
                              focusNode.attributes['mc-delete-url'] = "magical_lowcode/openapi/crud/"+tableName+"/delete-by-pk" ;
                              focusNode.attributes['mc-query-method'] = "post" ;
                              //子表信息
                              var childrenHtml = "";
                              {
                                var children = focusNode.magicalCoder.children;
                                for(var i=0;i<children.length;i++){
                                  var child = children[i];
                                  var slotParent = child.attributes['v-slot:parent'];
                                  if(slotParent){//找到了 加个lazy有利于内部空间宽自适应
                                    childrenHtml = MAGICAL_CODER_API.nodeToHtml({node:child,pure:true});
                                    break;
                                  }
                                }


                              }
                              // console.log('USER表',response.data.data.rootNode);
                              var rootNode=response.data.data.rootNode;
                              rootNode = eval("("+rootNode+")");
                              var strColumn= _t.buildColumnHtml(rootNode);
                              var rootNodeCp=_t.deepCopy(rootNode,rootNodeCp);
                              //表单编辑区域
                              _t.setVmodel(rootNode,'scope.form.',false);
                              rootNode.attributes['class']="mc-ui-absolute-pane"
                              var strAdd = MAGICAL_CODER_API.nodeToHtml({node:rootNode,pure:true});
                              //查询区域
                              _t.setVmodel(rootNodeCp,'scope.query.',true);
                              rootNodeCp.attributes['class']=""
                              var strSearch= MAGICAL_CODER_API.nodeToHtml({node:rootNodeCp,pure:true});
                              var htmlstr= '<template v-slot:query="scope">'+strSearch+'</template>'+
                                strColumn+
                                '<template v-slot:form="scope">'+strAdd+'</template>'+
                                '<template v-slot:operate></template>'+
                                childrenHtml;
                              MAGICAL_CODER_API.resetHtml({parentNode:focusNode,html:htmlstr,triggerChange:true});
                              MAGICAL_CODER_API.refreshRightAttrPane({id:focusNode.magicalCoder.id})

                            })
                        },
                        deepCopy:function(p, c){
                          var c = c || {};
                          for (var i in p) {
                            if (typeof p[i] === 'object' && p[i]!==null && typeof p[i]!='undefined') {
                              c[i] = (p[i].constructor === Array) ? [] : {};
                              this.deepCopy(p[i], c[i]);
                            } else {
                              c[i] = p[i];
                            }
                          }
                          return c;
                        },
                        setVmodel:function(rootNode, value,fromQuery){
                          rootNode.attributes['id']='';
                          if(fromQuery){
                            rootNode.attributes[':inline']="true";
                          }
                          var children = rootNode.magicalCoder.children;
                          if(children){
                            for(var i=0;i<children.length;i++){
                              var elFormItem = children[i];
                              var attributes= elFormItem.attributes;
                              var magicalCoder = elFormItem.magicalCoder;
                              if(fromQuery){
                                attributes['style']='';
                              }
                              {//寻找包含的控件
                                if(magicalCoder.children){
                                  var controlNode = magicalCoder.children[0]
                                  var controlAttributes = controlNode.attributes;
                                  var controlMagicalCoder = controlNode.magicalCoder;
                                  var tagName = controlMagicalCoder.tagName;
                                  var vModel = controlAttributes['v-model'];
                                  if(vModel){
                                    controlAttributes['v-model']=value+''+vModel;
                                  }
                                  //后续其他组件双向绑定就用这个变量名
                                  var dataSync = controlAttributes[':data.sync'];
                                  if(dataSync){
                                    controlAttributes[':data.sync']=value+''+dataSync;
                                  }
                                  if(fromQuery){
                                    if(tagName=='el-slider'){
                                      controlMagicalCoder.tagName = 'el-input';
                                    }else if(tagName == 'mc-image-upload' || tagName=='mc-kindeditor'){//此类组件无需查询
                                      children.splice(i,1);
                                      i--;
                                    }else if(tagName=='mc-switch'){
                                      controlAttributes[':mc-allow-null']="true";
                                      controlAttributes[':mc-default-value']="";
                                    }
                                  }
                                  //兼容下父子下拉框
                                  if(tagName=='mc-parent-child-select'){
                                    var pmodel = controlAttributes[':p-model.sync'];
                                    if(pmodel){
                                      controlAttributes[':p-model.sync']=value+''+pmodel;
                                    }
                                  }else if(tagName == 'mc-parent-child-grandson-select'){
                                    var pmodel = controlAttributes[':p-model.sync'];
                                    if(pmodel){
                                      controlAttributes[':p-model.sync']=value+''+pmodel;
                                    }
                                    var cmodel = controlAttributes[':c-model.sync'];
                                    if(cmodel){
                                      controlAttributes[':c-model.sync']=value+''+cmodel;
                                    }
                                  }
                                }
                              }
                            }
                          }
                        },
                        /**获取列*/
                        buildColumnHtml:function(rootNode){
                          var columnHtml = [];
                          var tableInfo = {};
                          //字段信息
                          var children = rootNode.magicalCoder.children;
                          if(children){
                            for(var i=0;i<children.length;i++){
                              var field = {};
                              var elFormItem = children[i];
                              var attributes = elFormItem.attributes;
                              var magicalCoder = elFormItem.magicalCoder;
                              //注释
                              field.comment = attributes.label;
                              var mcColConfig = "";

                              {//寻找包含的控件
                                if(magicalCoder.children){
                                  var controlNode = magicalCoder.children[0]
                                  var controlAttributes = controlNode.attributes;
                                  var controlMagicalCoder = controlNode.magicalCoder;
                                  var tagName = controlMagicalCoder.tagName;
                                  if(tagName=='mc-kindeditor'){
                                    //这些组件就忽略展示列
                                    continue;
                                  }
                                  var vModel = controlAttributes['v-model'];
                                  field.name = vModel;
                                  if(!vModel){
                                    field.name = controlAttributes[':data.sync'];
                                  }
                                  if(tagName=='mc-parent-child-select'){//父子下拉框
                                      mcColConfig = this.parsePCSConfig(controlNode.attributes[':mc-child-config'])
                                      //检测父亲下拉框是否配置字段
                                      var pmodel = controlAttributes[':p-model.sync'];
                                      if(pmodel){
                                          field.comment = controlAttributes['mc-child-comment'];
                                          columnHtml.push('<mc-new-vxe-table-column'+this.parsePCSConfig(controlNode.attributes[':mc-parent-config'])+' field="'+pmodel+'" title="'+controlAttributes['mc-parent-comment']+'"></mc-new-vxe-table-column>');
                                      }
                                  }else if(tagName=='mc-parent-child-grandson-select'){
                                      mcColConfig = this.parsePCSConfig(controlNode.attributes[':mc-grandson-config'])
                                      //检测父亲下拉框是否配置字段
                                      var pmodel = controlAttributes[':p-model.sync'];
                                      if(pmodel){
                                          columnHtml.push('<mc-new-vxe-table-column'+this.parsePCSConfig(controlNode.attributes[':mc-parent-config'])+' field="'+pmodel+'" title="'+controlAttributes['mc-parent-comment']+'"></mc-new-vxe-table-column>');
                                      }
                                                                            //检测父亲下拉框是否配置字段
                                      var cmodel = controlAttributes[':c-model.sync'];
                                      if(cmodel){
                                          field.comment = controlAttributes['mc-grandson-comment'];
                                          columnHtml.push('<mc-new-vxe-table-column'+this.parsePCSConfig(controlNode.attributes[':mc-child-config'])+' field="'+cmodel+'" title="'+controlAttributes['mc-child-comment']+'"></mc-new-vxe-table-column>');
                                      }
                                  }
                                  else{
                                  //构建mc-col-config
                                    mcColConfig = this.buildColConfigHtml(controlNode);
                                  }
                                }
                              }
                              columnHtml.push('<mc-new-vxe-table-column'+mcColConfig+' field="'+field.name+'" title="'+field.comment+'"></mc-new-vxe-table-column>');
                            }
                          }
                          return columnHtml.join("");
                        },
                        buildColConfigHtml:function(controlNode){
                          var config = ""
                          var tagName = controlNode.magicalCoder.tagName;
                          switch(tagName){
                            case 'mc-checkbox-group':
                              config = {type:'checkbox',options:[]}
                              var cbxChildren = controlNode.magicalCoder.children;
                              for(var i=0;i<cbxChildren.length;i++){
                                var cbx = cbxChildren[i];
                                if(cbx.magicalCoder.children &&cbx.magicalCoder.children.length>0){
                                  var k = cbx.attributes['label'];
                                  var v = cbx.magicalCoder.children[0].magicalCoder.textContent;
                                  config.options.push({k:k,v:v});
                                }
                              }
                              break;
                            case 'el-radio-group':
                              config = {type:'radio',options:[]}
                              var rdiChildren = controlNode.magicalCoder.children;
                              for(var i=0;i<rdiChildren.length;i++){
                                var rdi = rdiChildren[i];
                                if(rdi.magicalCoder.children &&rdi.magicalCoder.children.length>0){
                                  var k = rdi.attributes['label'];
                                  var v = rdi.magicalCoder.children[0].magicalCoder.textContent;
                                  config.options.push({k:k,v:v});
                                }
                              }
                              break;
                            case 'el-select':
                              config = {type:'select',options:[]}
                              var options = controlNode.magicalCoder.children;
                              for(var i=0;i<options.length;i++){
                                var option = options[i];
                                var v = option.attributes['label'];
                                var k = option.attributes['value'];
                                config.options.push({k:k,v:v});
                              }
                              break;
                            case 'mc-switch':
                              config = {type:'boolean',options:[]}
                              var activeText = controlNode.attributes['active-text'] || "是"
                              var inActiveText = controlNode.attributes['inactive-text'] || "否"
                              config.options.push({k:"true",v:activeText})
                              config.options.push({k:"false",v:inActiveText})
                              break;
                            case 'mc-remote-select':
                              var mcColConfig = controlNode.attributes[':mc-config'];//把limit替换掉
                              if(mcColConfig){
                                mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"'));
                                delete mcColConfig.api['limit'];
                                mcColConfig = JSON.stringify(mcColConfig).replace(/"/g,'\'')
                                var mcTmpData = controlNode.attributes[':mc-config-tmp']
                                return ' :mc-col-config="'+mcColConfig+'" :mc-tmp-data="'+mcTmpData+'"';
                              }
                              break;
                            case 'mc-select':
                              config = controlNode.attributes[':mc-config'];
                              if(config){
                                return ' :mc-col-config="'+config+'"';
                              }
                              break;
                          }
                          if(config){
                            return ' :mc-col-config="'+JSON.stringify(config).replace(/"/g,'\'')+'"';
                          }
                          return "";
                        },
                        parsePCSConfig:function(mcChildColConfig){
                            if(mcChildColConfig){
                              mcChildColConfig = JSON.parse(mcChildColConfig.replace(/'/g,'"'));
                              delete mcChildColConfig.api['limit'];
                              mcChildColConfig.type = "pk";
                              var tmp = mcChildColConfig.tmp;
                              delete mcChildColConfig['tmp'];
                              mcChildColConfig = JSON.stringify(mcChildColConfig).replace(/"/g,'\'');
                              var mcTmpData = JSON.stringify(tmp).replace(/"/g,'\'');
                              return ' :mc-col-config="'+mcChildColConfig+'" :mc-tmp-data="'+mcTmpData+'"' ;
                            }
                            return "";
                        },
                        openDrawer:function(){
                          this.drawer = true;
                          var _t = this;
                          CommonUtil.axiosWithServerName("get","/magical_lowcode/user/database/list",
                            {
                              params: {projectUuid:projectUuid}
                            },function(response){
                              _t.treeList = response.data;
                            }
                          )
                        },
                        changeMe:function (newValue) {
                          MAGICAL_CODER_API.resetHtml({parentNode:focusNode,html:"",triggerChange:true});
                        }
                      }
                    })
                  }
                }
              },
              {
                "type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"查询Method","attrName":"mc-query-method",
                "options":[
                  {
                    "post":"POST",
                    "get":"GET",
                  }
                ]
              },
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","attrName":"mc-query-url","title":"查询地址"},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","attrName":"mc-save-url","title":"保存地址"},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","attrName":"mc-delete-url","title":"删除地址"},
              {type:"checkbox",clearAttr:true,oneLine:true,change:"attr",title:'状态' ,options:[{n:":mc-show-query-operate",t:"查询操作",c:"true",u:"false",dv:"true"},{n:":mc-show-pagination",t:"显示分页",c:"true",u:"false",dv:"true"},{n:":mc-show-row-operate",t:"行操作",c:"true",u:"false",dv:"true"}]},
              {"type":"slider","clearAttr":true,"oneLine":true,"change":"attr","attrName":":mc-page-size","title":"每页多少条"},
              {"type":"slider","clearAttr":true,"oneLine":true,"change":"attr","attrName":":mc-pager-count","title":"页码数量",extra:{min:5,max:21,step:2}},
              {type:"html",
                callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcChildrenApp">'+
                      '<div class="layui-col-xs3">子表</div>'+
                      '<div class="layui-col-xs9">'+
                      '<el-button @click="addChildren">添加子表</el-button>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    //从magicalCoder获取当前聚焦节点的属性值 准备传入vue里
                    var focusNode=param.focusNode;
                    new Vue({
                      el: '#mcChildrenApp',
                      data: {

                      },
                      mounted:function(){

                      },
                      methods:{
                        buildChildTableHtml:function(){
                          return TABLE_HTML.replace('<mc-new-vxe-table ','<mc-new-vxe-table :auto-resize="true" :mc-from-parent-query="scope.parent" :mc-pid-field-map="{\'pid\':\'id\'}" ');
                        },
                        addChildren:function(){
                          var children = focusNode.magicalCoder.children;
                          for(var i=0;i<children.length;i++){
                            var child = children[i];
                            var slotParent = child.attributes['v-slot:parent'];
                            if(slotParent){//找到了 加个lazy有利于内部空间宽自适应
                              if(child.magicalCoder.children.length<=0){
                                var html = '<el-tabs @tab-click="tabClick"><el-tab-pane  :lazy="true" name="first" label="子表">'+this.buildChildTableHtml()+'</el-tab-pane></el-tabs>';
                                MAGICAL_CODER_API.resetHtml({parentNode:child,html:html,triggerChange:true})
                              }else{
                                var tabs = child.magicalCoder.children[0];
                                if(tabs.magicalCoder.tagName=='el-tabs'){
                                  var html = '<el-tab-pane  :lazy="true" label="新子表">'+this.buildChildTableHtml()+'</el-tab-pane>';
                                  MAGICAL_CODER_API.appendHtml({parentNode:tabs,html:html,triggerChange:true})
                                }else{
                                  this.$notify("检测到您修改了子表的标签根节点，请自行添加吧")
                                }
                              }
                            }
                          }
                        }
                      }
                    })
                  }
                }
              },
              {
                type:"html",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcPidFieldMapApp">'+
                      '<div class="layui-col-xs12">外键映射</div>'+
                      '<div class="layui-col-xs12">'+
                      '<el-form label-width="120px" size="mini" label-position="left">'+
                      ' <mc-map :data="dataMap" @focus-key="focusKey" @focus-value="focusValue" key-placeholder="当前表键名" value-placeholder="父亲表键名"></mc-map>'+
                      ' <el-drawer title="选择字段" :visible.sync="drawer" :modal="false">'+
                      '       <mc-db-table-field @choose="choose" :data="treeData" :project-uuid="projectUuid"></mc-db-table-field>'+
                      ' </el-drawer>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success">保存外键配置</el-button>'+
                      '            </el-form-item>'+
                      '        </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var config = focusNode.attributes[':mc-pid-field-map'];
                    if(config){
                      config = JSON.parse(config.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      config = {};
                    }
                    new Vue({
                      el:"#mcPidFieldMapApp",
                      data:{
                        projectUuid:projectUuid,
                        dataMap:config,
                        drawer:false,
                        treeData:{
                          db:"",
                          table:"",
                          field:""
                        },
                        currentData:null
                      },
                      mounted:function(){

                      },
                      methods:{
                        focusKey:function(item){
                          this.currentData = item;
                          this.drawer =true;
                        },
                        focusValue:function(item){
                          this.currentData = item;
                          this.drawer =true;
                        },
                        choose:function(data){
                          this.currentData.item[this.currentData.field]=data.field;
                        },
                        isEmptyMap:function(map){
                          if(map){
                            for(var key in map){
                              return false;
                            }
                          }
                          return true;
                        },
                        confirm:function(){
                          if(!this.isEmptyMap(this.dataMap)){
                            MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-pid-field-map",value:JSON.stringify(this.dataMap).replace(/"/g,"'"),triggerChange:true})
                          }else{
                            MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-pid-field-map",value:"",triggerChange:true})
                          }
                          this.$notify({type:"success",message:"保存成功"})
                        }
                      }
                    })

                  }
                }
              },
            ]
          },
          {
            title:"属性",content:[
              {
                type:"select",oneLine:true,change:"attr",attrName:"border",title:"边框",options:[{"none":"无"},{"full":"完整"},{"default":"默认"},{"outer":"外边框"},{"inner":"内边框"}],
              },
              {
                "type": "checkbox", "clearAttr": true, "oneLine": true, "change": "attr", "title": "状态", "options": [
                  { "c": "true", "n": "resizable", "t": "拖动改变宽度", "u": "false" },
                  { "c": true, "n": "sortable", "t": "排序", "u": false },
                  { "c": true, "n": "stripe", "t": "斑马纹", "u": false },
                  { "c": true, "n": "round", "t": "圆角边框", "u": false },
                  { "c": true, "n": "loading", "t": "显示加载中", "u": false,"d":true },
                  { "c": true, "n": "show-header", "t": "显示表头", "u": false },
                  { "c": true, "n": "highlight-current-row", "t": "高亮当前行", "u": false },
                  { "c": true, "n": "highlight-hover-row", "t": "鼠标移到行高亮显示", "u": false },
                  { "c": true, "n": "highlight-current-column", "t": "高亮当前列", "u": false },
                  { "c": true, "n": "highlight-hover-column", "t": "鼠标移到列高亮显示", "u": false },
                  { "c": true, "n": "show-footer", "t": "显示表尾", "u": false },
                  { "c": true, "n": "column-key", "t": "是否需要为每一列的 VNode 设置 key 属性", "u": false },
                  { "c": true, "n": "row-key", "t": "是否需要为每一行的 VNode 设置 key 属性", "u": false },
                  { "c": true, "n": "keep-source", "t": "保持原始值的状态，被某些功能所依赖，比如编辑状态、还原数据等（开启后影响性能，具体取决于数据量）", "u": false },
                ]
              },
              //
              {
                type: "text", oneLine: true, change: "attr", attrName: "height", title: "高度", tooltip: "请输入表格高度"
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "max-height", title: "最大高度", tooltip: "请输入表格最大高度"
              },
              {
                type: "select", oneLine: true, change: "attr", attrName: "size", title: "尺寸", options: [{ "medium": "中等" }, { "small": "小型" }, { "mini": "迷你" }],
              },
              {
                type: "select", oneLine: true, change: "attr", attrName: "align", title: "列对齐方式", options: [{ "left": "左对齐" }, { "center": "居中对齐" }, { "right": "右对齐" }],
              },
              {
                type: "select", oneLine: true, change: "attr", attrName: "header-align", title: "表头列的对齐方式", options: [{ "left": "左对齐" }, { "center": "居中对齐" }, { "right": "右对齐" }],
              },
              {
                type: "select", oneLine: true, change: "attr", attrName: "footer-align", title: "表尾列的对齐方式", options: [{ "left": "左对齐" }, { "center": "居中对齐" }, { "right": "右对齐" }],
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "row-class-name", title: "行附加 className"
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "cell-class-name", title: "单元格附加 className"
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "header-row-class-name", title: "表头的行附加 className"
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "header-cell-class-name", title: "表头的单元格附加 className"
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "footer-row-class-name", title: "表尾的行附加 className"
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "footer-cell-class-name", title: "表尾的单元格附加 className"
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "footer-method", title: "表尾的数据获取方法"
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "merge-cells", title: "临时合并指定的单元格"
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "merge-footer-items", title: "临时合并表尾"
              },
              {
                type: "select", oneLine: true, change: "attr", attrName: "show-overflow", title: "设置所有内容过长时显示为省略号", options: [{ "ellipsis": "只显示省略号" }, { "title": "并且显示为原生" }, { "tooltip": "并且显示为 tooltip 提示" }],
              },
              {
                type: "select", oneLine: true, change: "attr", attrName: "show-header-overflow", title: "设置表头所有内容过长时显示为省略号", options: [{ "ellipsis": "只显示省略号" }, { "title": "并且显示为原生" }, { "tooltip": "并且显示为 tooltip 提示" }],
              },
              {
                type: "select", oneLine: true, change: "attr", attrName: "show-footer-overflow", title: "设置表尾所有内容过长时显示为省略号", options: [{ "ellipsis": "只显示省略号" }, { "title": "并且显示为原生" }, { "tooltip": "并且显示为 tooltip 提示" }],
              },
              {
                type: "text", oneLine: true, change: "attr", attrName: "row-id", title: "自定义行数据唯一主键的字段名"
              },

            ]
          }
        ]
      },
      {"identifier":"mc-new-vxe-table-column",
        "properties":{"name":"表格列","treeExtraName":{"attr":["title"]},"dragInto":false,"duplicate":true,"assistDuplicate":true,"copy":false,"paste":true,"canDelete":true,"assistDelete":true,"onlyParents":["mc-new-vxe-table"],"assistAdd":true},
        "attributes":[
          {"title":"交互","active":false,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"字段变量名","attrName":"field"},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"标题","attrName":"title"},
              {
                type:"html",callback:{
                  htmlCallback:function(param){
                    var htmlTemp = '<div class="layui-row layui-col-space3" id="mcColConfigApp">'+
                      '<div class="layui-col-xs12">列扩展功能</div>'+
                      '<div class="layui-col-xs12">'+
                      '<el-form label-width="120px" size="mini" label-position="left">'+
                      '          <el-form-item label="类型">'+
                      '             <el-select v-model="mcColConfig.type">'+
                      '                 <el-option value="" label="清空"></el-option>'+
                      '                 <el-option value="checkbox" label="复选"></el-option>'+
                      '                 <el-option value="select" label="下拉"></el-option>'+
                      '                 <el-option value="radio" label="单向"></el-option>'+
                      '                 <el-option value="boolean" label="开关"></el-option>'+
                      '                 <el-option value="dict" label="字典"></el-option>'+
                      '                 <el-option value="pk" label="外键"></el-option>'+
                      '             </el-select>'+
                      '          </el-form-item>'+
                      '          <template v-if="mcColConfig.type==\'checkbox\'||mcColConfig.type==\'select\'||mcColConfig.type==\'radio\'||mcColConfig.type==\'boolean\'">'+
                      '              <el-form-item label="键值" v-if="!mcColConfig.options || mcColConfig.options.length<=0">'+
                      '                   <el-button size="mini" @click="addParam(0)">新增</el-button>'+
                      '              </el-form-item>'+
                      '              <template v-for="(item,idx) in mcColConfig.options">'+
                      '                 <el-form-item label="键值">'+
                      '                     <el-row>'+
                      '                           <el-col :span="8">'+
                      '                                <el-input v-model="item.k" placeholder="值"/>'+
                      '                           </el-col>'+
                      '                           <el-col :span="8">'+
                      '                                <el-input v-model="item.v" placeholder="标签"/>'+
                      '                           </el-col>'+
                      '                           <el-col :span="8">'+
                      '                                <el-button size="mini" @click="addParam(idx)">+</el-button>'+
                      '                                <el-button size="mini" @click="deleteParam(idx)">-</el-button>'+
                      '                           </el-col>'+
                      '                     </el-row>'+
                      '                 </el-form-item>'+
                      '              </template>'+
                      '          </template>'+
                      '          <template v-else-if="mcColConfig.type==\'pk\'||mcColConfig.type==\'dict\'">'+
                      '               <mc-api-origin :data="data" @choose="choose"  :project-uuid="projectUuid"></mc-api-origin>'+
                      '               <mc-api :data="mcColConfig.api"  :fields="fields" :show-save-btn="false" :show-fields="true"></mc-api>'+
                      '               <el-form-item label="外键查询字段名">'+
                      '                   <el-select v-model="mcColConfig.pkField" filterable allow-create  placeholder="一般为主键">'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '               <el-form-item label="下拉显示字段名">'+
                      '                   <el-select v-model="mcColConfig.pkTextField" filterable allow-create>'+
                      '                       <el-option v-for="(it,i) in fields" :key="it.name" :label="it.title" :value="it.name"></el-option>'+
                      '                   </el-select>'+
                      '               </el-form-item>'+
                      '          </template>'+
                      '           <el-form-item>'+
                      '                 <el-button size="medium" class="flow-right-bottom" @click="confirm" type="success" @click="confirm">保存配置</el-button>'+
                      '            </el-form-item>'+
                      '        </el-form>'+
                      '</div>'+
                      '</div>';
                    return htmlTemp;
                  },
                  render:function (param) {
                    var focusNode = param.focusNode;
                    var mcColConfig = focusNode.attributes[':mc-col-config'];
                    var mcTmpData = focusNode.attributes[':mc-tmp-data'];
                    if(mcColConfig){
                      mcColConfig = JSON.parse(mcColConfig.replace(/'/g,'"').replace(/&gt;/g,">").replace(/&lt;/g,"<"));
                    }else{
                      mcColConfig = {type:"",options:[],
                        api:{
                          method:"post",//post|get
                          url:"",//
                          params:[],//name入参名 compare:比较符号 value:值 type:number,string
                          fields:[]//返回字段
                        }
                      };
                    }
                    if(mcTmpData){
                      mcTmpData = JSON.parse(mcTmpData.replace(/'/g,'"'));
                    }else{
                      mcTmpData = {
                        stage:"db",//api|db
                        apiUuid:"",
                        tableUuid:""
                      }
                    }
                    new Vue({
                      el:"#mcColConfigApp",
                      data:{
                        projectUuid:projectUuid,
                        mcColConfig:mcColConfig,
                        data:mcTmpData,
                        fields:[]
                      },
                      mounted:function(){

                      },
                      methods:{
                        buildOneParam:function(){
                          return {k:"",v:""}
                        },
                        addParam:function(idx){
                          this.mcColConfig.options.splice(idx+1,0,this.buildOneParam())
                        },
                        deleteParam:function(idx){
                          this.mcColConfig.options.splice(idx,1)
                        },
                        choose:function(val){
                          if(val.stage=='db'){
                            this.fields = val.fields;
                            this.mcColConfig.api.url = "magical_lowcode/openapi/crud/"+val.tableName+"/list";
                          }else{
                            this.fields = [];
                            if(val.apiUuid){
                              this.mcColConfig.api.url = "magical_lowcode/openapi/post/"+val.apiUuid;
                            }else{
                              this.mcColConfig.api.url = "";
                            }

                          }
                        },
                        confirm:function(){
                          //检查配置合法性
                          MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-tmp-data",value:JSON.stringify(this.data).replace(/"/g,"'"),triggerChange:false})
                          if(this.mcColConfig.type){
                            if(this.mcColConfig.type=='pk'){
                              var api = this.mcColConfig.api;
                              var pkField = this.mcColConfig.pkField;
                              var pkTextField = this.mcColConfig.pkTextField;
                              if(!pkField){
                                this.$notify({type:"error",message:"请配置外键查询字段名，一般为外键的主键"});
                                return;
                              }
                              if(!pkTextField){
                                this.$notify({type:"error",message:"请配置下拉显示字段名，您希望表格显示的外键表字段内容"});
                                return;
                              }
                              if(api){
                                if(!api.url){
                                  this.$notify({type:"error",message:"请配置接口地址"});
                                  return;
                                }
                              }
                            }

                            MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-col-config",value:JSON.stringify(this.mcColConfig).replace(/"/g,"'"),triggerChange:true})
                          }else{
                            MAGICAL_CODER_API.changeAttr({node:focusNode,name:":mc-col-config",value:""})
                          }
                          this.$notify({type:"success",message:"保存成功"})
                        }
                      }
                    })

                  }}
              },
            ]},
          {"title":"属性","active":true,"content":[
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"宽度","attrName":"width",placeholder:"例如：200,20%,100px"},
              {"type":"text","clearAttr":true,"oneLine":true,"change":"attr","title":"最小宽度","attrName":"min-width",placeholder:"例如：200,20%,100px"},
              {"type":"checkbox","clearAttr":true,"oneLine":true,"change":"attr","title":"状态","options":[
                  {"c":"true","n":"resizable","t":"拖动改变宽度","u":"false"},
                  {"c":true,"n":"sortable","t":"排序","u":false},
                  {"c":true,"n":"show-overflow","t":"溢出显示省略号","u":false},
                  {"c":true,"n":"show-header-overflow","t":"表头溢出显示省略号","u":false},
                  {"c":true,"n":"show-footer-overflow","t":"表体溢出显示省略号","u":false}
                ]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"固定位置","tooltip":"固定位置","attrName":"fixed","options":[{"left":"左"},{"right":"右"}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"对齐方式","attrName":"align","options":[{"left":"左"},{"center":"中"},{"right":"右"}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"表头对齐方式","attrName":"header-align","options":[{"left":"左"},{"center":"中"},{"right":"右"}]},
              {"type":"select","clearAttr":true,"oneLine":true,"change":"attr","title":"表尾对齐方式","attrName":"footer-align","options":[{"left":"左"},{"center":"中"},{"right":"右"}]},
              { "type": "select", "clearAttr": true, "oneLine": true, "change": "attr", "title": "内容过长显示为省略号", "attrName": "show-overflow", "options": [{ "ellipsis": "只显示省略号" }, { "title": "并且显示为原生 title" }, { "tooltip": "并且显示为 tooltip 提示" }] },
              { "type": "select", "clearAttr": true, "oneLine": true, "change": "attr", "title": "表头内容过长显示为省略号", "attrName": "show-header-overflow", "options": [{ "ellipsis": "只显示省略号" }, { "title": "并且显示为原生 title" }, { "tooltip": "并且显示为 tooltip 提示" }] },
              { "type": "select", "clearAttr": true, "oneLine": true, "change": "attr", "title": "表尾内容过长显示为省略号", "attrName": "show-footer-overflow", "options": [{ "ellipsis": "只显示省略号" }, { "title": "并且显示为原生 title" }, { "tooltip": "并且显示为 tooltip 提示" }] },

              { "type": "text", "clearAttr": true, "oneLine": true, "change": "attr", "title": "给单元格附加 className", "attrName": "class-name" },
              { "type": "text", "clearAttr": true, "oneLine": true, "change": "attr", "title": "给表头的单元格附加 className", "attrName": "header-class-name" },
              { "type": "text", "clearAttr": true, "oneLine": true, "change": "attr", "title": "给表尾的单元格附加 className", "attrName": "footer-class-name" },
              { "type": "text", "clearAttr": true, "oneLine": true, "change": "attr", "title": "格式化显示内容", "attrName": "formatter" },
            ]},
        ]},
    ],
    /*回调处理*/
    callbacks:[

    ],
    /*处理环境变量application-env.js*/
    changeEnv:function(appEnv){

    },
    styles:[
      {
        order:1,
        css:
          ''
      }
    ]
  });
})();
